CSS常用内容总结(一)
1. 选择器,即设置的样式可以应用到HTML的什么位置。
① 标签选择器
例 div{ background-color:red }
<div> </div>,则为div设置样式。
② class选择器
.classelect{ background-color:red }
<div class='classelect'> </div>,则为class为classelect的标签设置样式。
③ id选择器
#idselect{ background-color:red }
<div id='idselect'> </div>,则为id为idselect的标签设置样式。
④ 组合选择器
div,span,p{ background-color:red },即为多个标签设置此样式。
⑤ 层级选择器
.c1 #c2 span{ background-color:red } ,即id为c1下的class为c2下的span标签的属性。
⑤属性选择器
input[type='button']{ height:100px },即为type属性为submit的标签设置样式。
2. background
background-color设置背景色。
background-image:urt('xxxx.jpg') 引用图片。
当在div中引用图片时,
<div style='background-image:url('image/111.jpg')'> </div>,此图片会这个div里不断重复,要是想要不重复或者只在某个方向上重复可以用
background-repeat(no-repeat;repeat-x;repeat-y)
截取一张图片的某个部分:background-position。
3. border
border:1px solid; 实线边框
border:1px dotted; 点状边框
border:1px dashed; 虚线边框
4. margin,设置外边距。
margin:20px; 距此标签的父级标签的四边都为20像素
margin-top: 20px; 距此标签的父级标签的上边20像素
margin-bottom: 20px; 距此标签的父级标签的下边20像素
margin-left: 20px; 距此标签的父级标签的左边20像素
margin-right: 20px; 距此标签的父级标签的右边20像素
5.padding,设置内边距。