在这篇文章中,主要是对CSS的一个小总结。
相信大家都知道,CSS 用于控制网页的样式和布局。
CSS 指层叠样式表 (Cascading Style Sheets)
那么怎么编写CSS呢?
嗯,对,差不多就是这么编写的。
我感觉css难的地方就是记得东西比较多,不过不一定要死记硬背,平时多用几遍就记住了。
这里提醒一下,下面提到的东西不一定是经常用到的,不过也要了解一下,万一有真人才或是“真人才”用到了呢,对吧?
.
CSS 选择器参考手册:
举个例子:
input[type="botton"]
{
width: 20px;
...
}
.
CSS背景属性:
eg:
body{
background-attachment:fixed;(默认scroll)
background-color:red;
background-image:url(...);
background-repeat:no-repeat;
background-position:center; (50% 50%)
}
.
CSS字体属性:
eg:
body{
font-family: Verdana, Geneva, Tahoma, sans-serif;
font-size: 5em;
font-style: inherit;
font-variant: oblique ;
font-weight: 500;
}
.
CSS文本属性:
eg:
p{
color: brown;
direction: ltr;
text-indent: 5em; /*20%*/
text-align: justify;
word-spacing: normal;
letter-spacing: initial;
text-transform: uppercase;
text-decoration: underline;
white-space: pre;
}
.
CSS列表属性:
eg:
li { list-style : url(...) square inside }
或:
ul{
list-style-type:none;
margin:0;
padding:0;
}
.
CSS Table 属性:
eg:
table{
border-collapse: collapse;
width: 100px;
height: 100px;
empty-cells: hide;
caption-side: top;
}
.
CSS边框属性:
eg:
div{
outline-width: 5px;
outline-style: solid;
outline-color: seagreen;
}
.
CSS定位属性:
eg:
#box{
position: relative;
left: 30px;
top: 20px;
}
或
#box{
position: absolute;
left: 30px;
top: 20px;
}
或
.box img {
float: left;
}
.
接下来,这个伪类也不是说难,就是一开始不太容易理解,当然,除了厉害的人。
CSS伪类:
eg:
a.red : visited {color: #FF0000}
<a class="red" href="....asp">...</a>
或
p:first-child {
color: red;
}
.
CSS伪元素:
这个写法和上面的伪类很相似,就不多描述了。
.
CSS 分类属性 (Classification):
若有不当或欠缺之处,欢迎指正!
(之后还会更新CSS3,emmm,差不多都是小总结吧^ _ ^)