其他问题

link 标签的加载会和 script 一样影响 DOM 渲染吗？

• CSS 的加载不会阻塞 DOM 的解析
• CSS 的加载会阻塞 DOM 的渲染
• CSS 的加载会阻塞 JS 语句的执行

img 的 style 宽度覆盖问题

已知 img 标签如下，如何使图片宽度变为 300（不改变现有代码）

<img src="1.jpg" style="width:480px!important;”>

• 使用最大宽度进行覆盖： max-width:300
• 使用 padding： padding: 0 90px
• 使用缩放： transform: scale(0.625, 1)

nth-child() 和 nth-of-type() 的区别是什么？

nth-child 是选中子元素中的第 N 个，nth-of-type 选中子元素中某类型的第 N 个

常见的可继承和不可继承属性有哪些？

基本原则：文本属性可继承，盒模型和布局属性不可继承

• 可继承：color、font-size、font-family
• 不可继承：height、border、margin

z-index 的工作原理，什么时候会失效？

• 作用的元素要是定位元素（默认的 position:static 不生效）
• 子元素的 z-index 无法影响父元素外部的层级。父元素被覆盖时子元素设置为更高的 z-index 也无效

图片替换文字的常见方法有哪些？

为什么要用图片替代文字？

• 用图片有更好的展示效果
• 保留文字，为了优化 SEO 的效果

替代方式：使用 text-indent、font-size:0、opacity 等隐藏文字