首页 > 代码库 > css基础1

css基础1

css选择器分类:

元素选择器 h{}

id选择器 #{}
类选择器 .{}
派生选择器 h span{}
后代选择器(包含选择器) ul li{}

子元素选择器 h2>strong
相邻兄弟选择器 p+p
伪类选择器 :
伪元素选择器 :
通配符选择器 *{ }

伪类选择器:伪类用于向某些选择器添加特殊的效果
锚伪点:支持 CSS 的浏览器中,链接的不同状态都可以不同的方式显示
a:link {color: #FF0000} /* 未访问的链接 */
a:visited {color: #00FF00} /* 已访问的链接 */
a:hover {color: #FF00FF} /* 鼠标移动到链接上 */
a:active {color: #0000FF} /* 选定的链接 */


伪元素是::(以前的写法,扩展知识)
:first-child:向带有指定 lang 属性的元素添加样式
:first-line: 伪元素用于向文本的首行设置特殊样式,只能用于块级元素
:first-letter:首字变大
:before在元素前添加内容

background-color :背景颜色(0,0,0);(255,255,255)
background-image 把图像设置为背景
background-repeat背景是否重复 norepeat不重复
background-attachment背景图像是否固定或者随着页面的其余部分滚动
background-size

css文本
属性
color:设置文本的颜色
颜色三种表示方式:英文单词,十六进制的颜色如:#ff0000,rgb代码的颜色:rgb(0-255,0-255,0-255)

direction:设置文本方向(属性值:ltr:默认,文本方向从左到右 rtl:文本方向从右到左)


line-height:设置行高(属性值:normal:默认 length:设置固定的行间距)


letter-spacing:设置字符间距(属性值:normal:默认值 length:设置字符间的间距值(可以为负数))


text-align:设置指定元素的文本对齐方式(属性值:left:相左对齐 right:向右对齐)


text-indent:缩进元素中文本的首行(属性值:length 定义固定的缩进。默认值:0 )

text-transform:控制元素中的字母(属性值:none 默认 capitalize 文本中的每个单词以大写字母开头
uppercase 定义仅有大写字母。 lowercase 定义无大写字母,仅有小写字母。 )

white-space:设置元素中空白的处理方式(属性值:normal 默认。空白会被浏览器忽略。 pre 空白会被浏览器保留。
nowrap 文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。 pre-wrap 保留空白符序列,但是正常地进行换行。
pre-line 合并空白符序列,但是保留换行符。 )


word-spacing:设置字间距(属性值:normal 默认 length 定义单词间的固定空间。 )

 

font-family:为段落设置字体
font-size:字体大小
font-style:字体样式(属性值:normal - 文本正常显示 talic - 文本斜体显示
oblique - 文本倾斜显示

font-weight:字体粗细

css表格:
css中设置表格边框,使用border属性:table,th,td{border:1px solid red}
表格显示为单线条边框,使用 border-collapse 属性
text-align 和 vertical-align 属性设置表格中文本的对齐方式。
vertical-align 属性设置垂直对齐方式,比如顶部对齐、底部对齐或居中对齐:
text-align 属性设置水平对齐方式,比如左对齐、右对齐或者居中:
/如需控制表格中内容与边框的距离,请为 td 和 th 元素设置 padding 属性:
border-collapse 设置是否把表格边框合并为单一的边框。 separate 默认值。边框会被分开 ;collapse 如果可能,边框会合并为一个单一的边框
border-spacing 设置分隔单元格边框的距离。length length 规定相邻单元的边框之间的距离。使用 px、cm 等单位。不允许使用负值。
caption-side 设置表格标题的位置。top 默认值。把表格标题定位在表格之上。bottom 把表格标题定位在表格之下。 empty-cells 设置是否显示表格中的空单元格。hide 不在空单元格周围绘制边框。
show 在空单元格周围绘制边框。默认。

css基础1