标签:
重新撸一遍CSS的基础,因为以前面试的时候被问到,突然发现某些概念搞不清楚,瞬间懵逼了,其实我都知道的,就是因为不会炒概念,导致面试官觉得我很low,你特么连这个都不知道还敢来面试,回家种田去好嘛!
样式分类
1.行内样式/行间样式
<p style="color:#F00; background:#CCC; font-size:12px;"></p>
虽然这种方法比较直接,在制作页面的时候需要为很多的标签设置style属性,所以会导致HTML页面不够纯净,文件体积过大,不利于搜索蜘蛛爬行,从而导致后期维护成本高。
2.内嵌样式
<head> .test{background:#eee;} </head>
3.链接样式
<link type="text/css" rel="stylesheet" href="style.css" />
4.导入样式
@import style.css
行内样式 > 内嵌样式 > 链接样式 > 导入样式
行内样式 > 内嵌样式 > 链接样式 > 导入样式
行内样式 > 内嵌样式 > 链接样式 > 导入样式
重要的事情说三遍...
选择器
标签选择器/元素选择器
a{text-decoration:none;}
ID选择器
#test{background:#eee;}
类选择器
.test1{background:#eee;} .test2{background:#fff;} .test3{background:#000;}
<div class="test1 test2 test3"></div>
通用选择器
*{margin:0px; padding:0px;}
不过这么用不太好,因为*会把HTML所有的标签都遍历一遍,太浪费了,最好是用到哪些再写哪些
body,div,p,a,ul,li{margin:0; padding:0;}
选择器的集体声明
h1,h2,h3,h4,h5,h6{color:#900;}
选择器的嵌套
.test1 #test2 span{background:#eee;}
块状元素block
一般是其他元素的容器,可容纳内联元素和其他块状元素,块状元素排斥其他元素与其位于同一行,宽度(width)高度(height)起作用。常见块状元素为div和p。
内联元素inline
内联元素只能容纳文本或者其他内联元素,它允许其他内联元素与其位于同一行,但宽度(width)高度(height)不起作用。常见内联元素为“a”。
标签:
原文地址:http://www.cnblogs.com/zcynine/p/5008974.html