参加Web前端开发面试必备的CSS知识点

前言： 今天小T要跟大家分享的文章是关于参加Web前端开发面试必备的CSS知识点。css基本内容包括，类选择符，id选择符，伪

今天小T要跟大家分享的文章是关于参加Web前端开发面试必备的CSS知识点。css基本内容包括，类选择符，id选择符，伪类，伪元素，结构，继承，特殊性，层叠，元素分类，颜色，长度，url，文本，字体，边框，块级元素，浮动元素，内联元素，定位。下面来和小T一起看一看吧！

链接：

link标签：

样式：

h1 { color: red; };

@import指示引入多个外部样式表的链接

@import url(styles.css);

p { color: red };

</style>

css注解

/* dashucoding */

内联样式：

<p style="color: red;" >dashucoding</p>

规范：

选择符 + 声明

p { color: red; } // 选择符属性值

p { font-weight: bold; }

伪类和伪元素

属性说明

:link超链接是一个未访问过的地址

:visited访问过的网页

:active处于活跃的状态

a { color: red; }; a:visited { color: red; };

伪元素：

:first-letter 和 :first-line 首字母和首行

p:first-letter { color: red; }

css有个特点是继承，可以依赖于祖先-后代关系。

!important有这个标记，表示这条规则优先

p { color: red !important; }

元素分类：

三种类型：块级元素，内联元素，列表项元素

块级元素有段落，标题，列表，表格，div，body等。内联元素有a，em，span等。列表项元素有li元素。

dispaly: block | inline | list-item | none

颜色：

rgb(100%, 100%, 100%) 红蓝绿，白色

单位：

em 给字体的font-size值

文本：

文本缩进

text-indent <长度> | <百分比>

p { text-indent: -4em; }

text-align属性

用于元素中文本行的对齐方式

text-align: left | center | right | justify

white-space空白

white-space pre | nowrap | normal

p { white-space: normal; } 将如何空白压缩成单个空白符

white-space属性值为pre，可以将元素内的空白忽略。

p { white-space: pre; }

行高：

line-height文本行的基线间的距离。

纵向对齐，vertical-align

vertical-align: baseline使元素的基线同父元素的基线对齐。

vertical-align: sub; vertical-align: super;

低端对齐： vertical-align

顶端对齐：vertical-align

vertical-align: top; vertical-align: text-top;

中间对齐：

vertical-align: middle;

文字间隔：

word-spacing 长度 | normal

word-spacing: 0.3em;

字母间隔：

letter-spacing: 长度 | normal

文本转换：

text-transform uppercase | lowercase | capitalize | none

文本修饰：

text-decoration: none | overline | line-through

框：

width 长度 | 百分比 | auto

height 长度 | auto

margin 长度 | 百分比 | auto

margin: top right bottom left

margin-top

margin-right

margin-bottom

margin-left

border-width // thin medium thick

border-style: none;

padding

浮动与清除

float: left | right | none

<img src="" style="float: right"; target='_blank'>IT培训网Web培训官网，最后祝愿小伙伴们工作顺利，成为一名优秀的Web前端开发工程师。

文章来源：原创 Jeskson 达达Web前端开发

【免责声明：本文图片及文字信息均由小T转载自网络，旨在分享提供阅读，版权归原作者所有，如有侵权请联系我们进行删除。】

Web前端开发工程师，是从事Web前端开发工作的工程师。主要进行网站的开发、优化、完善的工作。网页制作是Web 1.0时代的产物，那时网站的主要内容都是静态的，用户使用网站的行为也以浏览为主。

一位好的Web前端开发工程师在知识体系上既要有广度，又要有深度，所以很多大公司即使出高薪也很难招聘到理想的Web前端开发工程师。现在说的重点不在于讲解技术，而是更侧重于对技巧的讲解。技术非黑即白，只有对和错，而技巧则见仁见智。以前会Photoshop和Dreamweaver就可以制作网页，现在只掌握这些已经远远不够了。无论是开发难度上，还是开发方式上，现在的网页制作都更接近传统的网站后端开发，所以现在不再叫网页制作，而是叫Web前端开发。Web前端开发在产品开发环节中的作用变得越来越重要，而且需要专业的Web前端开发工程师才能做好，这方面的专业人才近两年来备受青睐。Web前端开发是一项很特殊的工作，涵盖的知识面非常广，既有具体的技术，又有抽象的理念。简单地说，它的主要职能就是把网站的界面更好地呈现给用户。

文章出自：http://qh.itpxw.cn/peixun/web/202186452.html

文章标题：参加Web前端开发面试必备的CSS知识点

免责声明：本站文章均由入驻起航学习网的会员所发或者网络转载，所述观点仅代表作者本人，不代表起航学习网立场。如有侵权或者其他问题，请联系举报，必删。侵权投诉

你也许会喜欢如下的文章？