"该文档包含了2016年BAT（百度、阿里巴巴、腾讯）以及其他互联网公司的前端面试中涉及的CSS相关题目，旨在测试应聘者对于前端开发，特别是CSS的掌握程度。"
在前端开发中，CSS（层叠样式表）扮演着至关重要的角色，它用于控制网页元素的布局和样式。以下是从文档中提炼出的关键知识点：
1. **CSS样式的应用方式**：
- 外部样式表：通过`<link>`标签引入外部CSS文件，使样式可复用且易于管理。
- 内部样式表：将CSS代码写在`<head>`标签内的`<style>`标签中，适用于整个页面的样式统一。
- 内联样式：直接在HTML元素中使用`style`属性定义样式，针对性强但不易维护。
2. **CSS选择器**：
- 派生选择器：如`p`或`div`等HTML标签选择器。
- ID选择器：使用`#idname`选择特定ID的元素。
- 类选择器：使用`.classname`选择具有特定类的元素。
- 属性选择器：如`[attr=value]`，较少使用。
- 后代选择器（如`div.a`）、群组选择器（如`p, div, #a`）。
**选择器优先级**：
- 特殊性原则：选择器越具体，优先级越高。
- 计算方法：派生选择器1，类选择器10，ID选择器100。
- 如`div.test1.spanvar`优先级为111，`span#xxx.songsli`优先级为1111，`#xxxli`优先级为101。
3. **隐藏DOM元素**：
- `display: none`：元素不占用空间，内容完全不可见。
- `visibility: hidden`：元素占用空间，内容不可见。
- 技巧性隐藏：如设置宽高为0，透明度为0，或负`z-index`。
4. **超链接状态问题**：
- 访问过后的超链接失去`:hover`和`:active`样式，解决办法是调整CSS属性顺序，即`L-V-H-A`（link, visited, hover, active）。
5. **CSS Hack**：
- CSS Hack是针对不同浏览器间CSS解析差异而采取的兼容策略。
- IE6 Hack：如`_property`，仅IE6识别。
- IE7 Hack：使用`*property`，IE7及更低版本识别。
- IE8 Hack：使用`!important`配合条件注释，或`*+html`选择器。
以上是文档中的部分核心CSS知识点，它们涵盖了基础样式应用、选择器的使用、样式优先级、元素隐藏方法以及CSS在不同浏览器间的兼容处理。对于前端开发者来说，熟练掌握这些知识是提升项目质量和效率的关键。
我的内容管理
展开
