该【关于css的知识点汇总 】是由【莫比乌斯】上传分享，文档一共【6】页，该文档可以免费在线阅读，需要了解更多关于【关于css的知识点汇总 】的内容，可以使用淘豆网的站内搜索功能，选择自己适合的文档，以下文字是截取该文章内的部分文字，如需要获得完整电子版，请下载此文档到您的设备，方便您编辑和打印。CSS知识点总结
CSS定义
<head>
<title>titleofarticle</title>
<linkrel=stylesheethref="CSS文件地址"type="text/css">
</head>
<head>
<styletype="text/css">
body{font-size:10px;}
p{font:12px;color:black;}
</style>
</head>
***@import“”;
CSS规则结构
选择器、属性和值
selector{property:value;}
例如:font{color:blue;}
class选择符
class选择器以一个点号显示,例子:
.center{text-align:center}
<h1class="center">
ID选择符
ID选择符的前面是#,例子:
#red{color:red;}
<pid="red">这个段落是红色。</p>
class和ID的区别
id应该具有唯一性
class可以多次出现
id的优先级高于class
CSS字体
文字颜色-color
字体-font-family
字号-font-size
字体粗细-font-weight(bold黑体,指定的范围为100~900,normal是400,bold相当于700)
字体格式-font-style指定斜体(italic草体风格斜体字,Oblique指标准倾斜)
-text-decoration指定字体修饰(Underline“下划线”,overline“上划线”,line-through“删除线”,blink霓虹灯效果,用半角空格隔开之后就可以应用多个属性的值)
CSS颜色及背景
背景颜色-background-color:颜色
背景图片-background-image:url(图片地址),例子:
body{background-image:url(/i/);}
背景图像的排列方式-background-repeat:排列方式,属性值:
repeat——在水平和垂直方向上都是以瓷砖形式反复显示(初始值)
repeat-x——只在水平方向重复显示
repeat-y——只在垂直方向重复显示
no-repeat——不重复只显示一个
背景图像的显示位置-background-position:显示位置,属性值:
数值或%来进行
left和top的值就相当于是0%,center就相当于50%,right和bottom就相当于100%
如果只指定了一个的话,那其余的就相当于指定的是center
固定背景图像-background-attachment:是否固定,属性值:
fixed固定背景图像的位置
scroll背景图像和其他内容一起滚动(初始值)
CSS文本属性
文本缩进-text-indent:数值
文本对齐-text-align:行对齐方式,属性值:
left、center、right、justify
处理空白-white-space:空白处理,属性值:
normal 默认。空白会被浏览器忽略。
pre 空白会被浏览器保留。其行为方式类似HTML中的<pre>标签。
nowrap 文本不会换行,文本会在在同一行上继续,直到遇到<br>标签为止。
pre-wrap 保留空白符序列,但是正常地进行换行。
pre-line 合并空白符序列,但是保留换行符。
行高-line-height:行高,属性值:
normal 默认。设置合理的行间距。
number 设置数字,此数字会与当前的字体尺寸相乘来设置行间距。
length 设置固定的行间距。
% 基于当前字体尺寸的百分比行间距。
纵向对齐-vertical-align:垂直方向的对齐,属性值:
baseline 默认。元素放置在父元素的基线上。
sub 垂直对齐文本的下标。
super 垂直对齐文本的上标
top 把元素的顶端与行中最高元素的顶端对齐
text-top 把元素的顶端与父元素字体的顶端对齐
middle 把此元素放置在父元素的中部。
bottom 把元素的顶端与行中最低的元素的顶端对齐。
text-bottom 把元素的底端与父元素字体的底端对齐。
length
% 使用"line-height"属性的百分比值来排列此元素。允许使用负值。
文字间隔-word-spacing:单词间距
字母间隔-letter-spacing:文字间距
文本修饰-text-decoration:修饰,属性值:
none 默认。定义标准的文本。
underline 定义文本下的一条线。
overline 定义文本上的一条线。
line-through 定义穿过文本下的一条线。
blink 定义闪烁的文本(无法运行在IE和Opera中)
定位:
把元素放置到一个静态的、相对的、绝对的、或固定的位置中
position
static
默认。位置设置为static的元素,它始终会处于页面流给予的位置(static元素会忽略任何top、bottom、left或right声明)。
relative
相对定位。位置被设置为relative的元素,可将其移至相对于其正常位置的地方,因此"left:20"将向元素的LEFT位置添加20个像素。
absolute
绝对定位。位置设置为absolute的元素,可定位于相对于包含它的元素的指定坐标。此元素的位置可通过"left"、"top"、"right"以及"bottom"属性来规定。
fixed
位置被设置为fixed的元素,可定位于相对于浏览器窗口的指定坐标。此元素的位置可通过"left"、"top"、"right"以及"bottom"属性来规定。不论窗口滚动与否,元素都会留在那个位置。工作于IE7(strict模式)。
设置元素的堆叠顺序
z-index
auto
默认。堆叠顺序与父元素相等。
number
设置元素的堆叠顺序。
其他:
float
display:block
clear:清空
CSS默写标准文档()
(2)
链接外部文件:
<linkrel=stylesheethref="CSS文件地址"type="text/css">
定义内部式样:
<styletype="text/css">
</style>
(3)
id具有唯一性
class可以多次出现
id的优先级高于class
(5)
font-family
font-size
font-weight
font-style
color
(8)
text-indent
text-align
text-decoration
vertical-align
white-space
line-height
word-spacing
letter-spacing
(5)
background-color
background-image
background-repeat
background-attachment
background-position
(12)
padding
margin
border
position
relative
absolute
float
clear
overflow
<div>
<ul>
<li></li>
</ul>
</div>
<dl>
<dt></dt>
<dd></dd>
</dl>
关于css的知识点汇总 来自淘豆网m.daumloan.com转载请标明出处.
