div+css之CSS 文本设置 CSS 字体设置 CSS 列表设置 CSS 表格设置 css outline轮廓

1、CSS 文本设置:
CSS 文本属性
属性 描述
color 设置文本颜色
direction 设置文本方向。
line-height 设置行高。
letter-spacing 设置字符间距。
text-align 对齐元素中的文本。
text-decoration 向文本添加修饰。
text-indent 缩进元素中文本的首行。
text-shadow 设置文本阴影。CSS2 包含该属性,但是 CSS2.1 没有保留该属性。
text-transform 控制元素中的字母。
unicode-bidi 设置文本方向。
white-space 设置元素中空白的处理方式。
word-spacing 设置字间距。

2、CSS 字体设置:
CSS 字体属性
属性 描述
font 简写属性。作用是把所有针对字体的属性设置在一个声明中。
font-family 设置字体系列。
font-size 设置字体的尺寸。
font-size-adjust 当首选字体不可用时,对替换字体进行智能缩放。(CSS2.1 已删除该属性。)
font-stretch 对字体进行水平拉伸。(CSS2.1 已删除该属性。)
font-style 设置字体风格。
font-variant 以小型大写字体或者正常字体显示文本。
font-weight 设置字体的粗细。

3、CSS 列表设置:
CSS 列表属性(list)
属性 描述
list-style 简写属性。用于把所有用于列表的属性设置于一个声明中。
list-style-image 将图象设置为列表项标志。
list-style-position 设置列表中列表项标志的位置。
list-style-type 设置列表项标志的类型。
marker-offset

列表项图像
有时,常规的标志是不够的。你可能想对各标志使用一个图像,这可以利用 list-style-image 属性做到:
ul li {list-style-image : url(xxx.gif)}
只需要简单地使用一个 url() 值,就可以使用图像作为标志。

4、CSS 表格设置:

表格边框: border 属性。
下面的例子为 table、th 以及 td 设置了蓝色边框:
table, th, td{border: 1px solid blue;}
折叠边框:border-collapse 属性设置将表格边框折叠为单一边框:
table{border-collapse:collapse;}
表格宽度和高度:通过 width 和 height 属性定义表格的宽度和高度。
table{width:100%;}
th{height:50px;}
表格文本对齐:text-align 属性设置水平对齐方式,比如左对齐、右对齐或者居中:
td{text-align:right;}
vertical-align 属性设置垂直对齐方式,比如顶部对齐、底部对齐或居中对齐:
td{height:50px;vertical-align:bottom;}
表格内边距:控制表格中内容与边框的距离,请为 td 和 th 元素设置 padding 属性:
td{padding:15px;}
表格颜色:
下面的例子设置边框的颜色,以及 th 元素的文本和背景颜色:
table, td, th{border:1px solid green;}
th{background-color:green;color:white;}

5、css outline轮廓线设置:

ooutline:在一个声明中设置所有的轮廓的属性。

outline-color:设置轮廓的颜色。

outline-style:设置轮廓的样式。包括以下选项:
none:默认。定义无轮廓。
dotted:定义点状的轮廓。
dashed:定义虚线轮廓。
solid:定义实线轮廓。
double:定义双线轮廓。双线的宽度等于outline-width的值。
groove:定义3D凹槽轮廓。此效果取决于outline-color的值。
ridge:定义3D凹槽轮廓。此效果取决于outline-color的值。
inset:定义3D凹槽轮廓。此效果取决于outline-color的值。
outset:定义3D凹槽轮廓。此效果取决于outline-color的值。
inherit:规定应该从父元素继承轮廓样式的设置。
outline-width:设置轮廓的宽度。

thin:规定细轮廓。
medium:默认。规定中等的轮廓。
thick:规定粗轮廓。
length:数值。规定轮廓粗细的值。
inherit:规定应该从父元素继承轮廓样式的设置。

猜你喜欢

转载自www.cnblogs.com/hongyaxi/p/9187687.html
今日推荐