前端面试大全(四)

第四部分 CSS 3

· CSS3新增伪类有那些?

CSS3新增伪类

p:last-of-type        选择其父元素的最后的一个P元素

p:last-child            选择其父元素的最后子元素(一定是P才行)

p:first-of-type        选择其父元素的首个P元素

p:first-child          选择其父元素的首个p元素(一定是p才行)

p:only-child    选择其父元素的只有一个元素(而且这个元素只能是p元素,不能有其他元素)

p:only-of-type   选择其父元素的只有一个p元素(不能有第二个P元素,其他元素可以有)

选第N个

p:nth-child(n)      选择其父元素的第N个 刚好是p的元素

p:nth-last-child(n)    ..............................................从最后一个子元素开始计数

p:nth-of-type(n)   选择其父元素的n个元素

p:nth-last-of-type(n)  ........................从最后一个子元素开始计数

用在input上

:enabled

:

· 请解释一下CSS3的Flexbox(弹性盒布局模型),以及适用场景?

· 主要作用是让元素body使用flexbox布局,而不是普通的块布局。在文档流中的所有子元素(即不是绝对定位的元素)现在都变成了伸缩项目。

::before 和 :after中双冒号和单冒号 有什么区别?解释一下这2个伪元素的作用。

单冒号(:)用于CSS3伪类,双冒号(::)用于CSS3伪元素。(伪元素由双冒号和伪元素    名称组成)  双冒号是在当前规范中引入的,用于区分伪类和伪元素。不过浏览器需要同时支持旧的    已经存在的伪元素写法, 比如:first-line、:first-letter、:before、:after等,    而新的在CSS3中引入的伪元素则不允许再支持旧的单冒号的写法。

想让插入的内容出现在其它内容前,使用::before,否者,使用::after;在代码顺序上,::after生成的内容也比::before生成的内容靠后。如果按堆栈视角,::after生成的内容会在::before生成的内容之上

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 本文转载自:众成翻译译者:为之漫笔链接:http://www.zcfy.cc/article/239原文:http...
    极乐君阅读 12,119评论 1 62
  • <a name='html'>HTML</a> Doctype作用?标准模式与兼容模式各有什么区别? (1)、<...
    clark124阅读 9,055评论 1 19
  • 本文转发自github, 原文地址 前端开发知识点: 作为一名前端工程师,无论工作年头长短都应该掌握的知识点: 此...
    XDUZ阅读 3,730评论 0 8
  • 上述故事的男主人公的睿智让我钦佩!回观我的现实生活,对他人的赞美的给予方面,我就是葛朗台! 除非对方做的无可挑剔,...
    米勒Li阅读 1,733评论 1 1
  • 好种子开花: 1, 中午老公说去吃墨西哥菜,是很久很久以前吃过的一个店,久到我都已经忘记了。今天再次吃到,仍然非常...
    成长中的小蜗牛阅读 1,432评论 3 1

友情链接更多精彩内容