关于css的知识点汇总.docVIP

CSS知识点总结 CSS定义 1.链接外部文件 head titletitle of article/title link rel=stylesheet href=CSS文件地址 type=text/css /head 2.定义内部式样 head style type=text/css body {font-size: 10px;} p {font: 12px; color: black;} /style /head 4.其他 @import “style.css”; CSS规则结构 选择器、属性和值 selector {property: value;} 例如：font {color: blue;} class选择符 class选择器以一个点号显示，例子： .center {text-align: center} h1 class=center ID选择符 ID选择符的前面是# ，例子： #red {color: red ;} p id=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/eg_bg_04.gif);} 背景图像的排列方式-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: 修饰，属性值： no