Rumah > Artikel > hujung hadapan web > CSS + DIV 使用方法总结_html/css_WEB-ITnose
(原文链接:)
CCS = Cascading Style Sheets
行间样式表(不推荐):
内部样式表(不推荐):
p{color:#F00;}
……
外部样式表(一般在head的title下面):
CSS书写结构:
{
: ;
……
}
如:
p {
color: #F00;
font-size: 12px;
}
基本类型选择器:
复合类型选择器:
标签
标签
字体和文本属性:
背景属性:
body{
background: #F00 url(images/bg.jpg) no-repeat fixed 50px 100px;
}
背景平铺:repeat-x 或 repeat-y,把图片按x轴或y轴(横向或竖向)平铺
优先级排序:默认
框模型(或盒模型):
, 等
注:当两个元素上下排列时,他们间的margin会自动合并(都不是float或绝对定位的情况下)
border的属性(分top, bottom, left, right):
可以缩写:border: solid 1px #FFF;
单独设置一条边:
(注:后面会覆盖前面的)
margin和padding的设置:
(注:padding的设置方法跟margin一样)
浮动(float):
清理(clear):
一般可以在浮动层和普通流直接加一个clear div来分隔排版,如:
.clear{clear:both;}
块水平居中:
注:body默认有8px的margin,取消方法:body{margin:0px;}
块垂直居中(较少用):
块内文本居中:
ul列表:
定位(通过position属性):
注:如果重叠,可以用z-index属性决定谁在上面,值大的在上。
尺寸:
内容超出父框的处理:
注:如果父框不设置height,则父框会被撑高,直到达到max-height为止。
浏览器滚动条设置:
如: html{
scrollbar-base-color:#F00;
}
注:貌似只对IE有效。
Photoshop切图过程:
原创文章,转载请注明转自Clement-Xu的csdn博客。)