css2

文本属性:

属性

含义

举例

color

设置文本颜色

color:#00C;

text-align

设置元素水平对齐方式

text-align:right;

text-indent

设置首行文本的缩进

text-indent:20px;

line-height

设置文本的行高

line-height:25px;

text-decoration

设置文本的装饰

text-decoration:underline;

color属性:

rgb:十六进制方法表示颜色,前两位表示红色分量,中间两位表示绿色分量,最后两位表示蓝色分类

rgn:正整数的取值范围为0~1

rgba:在rgb基础上增加了控制alpha透明度的参数,取值范围为0~1

实例:

text-align(设置元素水平对齐方式)

left:把文本排列到左边。默认值游浏览器决定

right:把文本排列到右边

center:把文本排列到中间

justify:实现两端对齐文本效果

text-decoration属性:

垂直对齐方式:

vertical-align属性:middle、top、bottom

none:默认值,定义的标准文本

underline:设置文本的下划线

overline:设置文本的上划线

line-through;设置文本的删除线

文本的阴影:

                              (x轴位移,)         (阴影模糊半径)

                                (x比如写:20xp)

text-shadow :color   x-offset   y-offset   blur-radius;

                     (阴影颜色)          (Y轴位移)

超级链接伪类:

伪类名称

含义

示例

a:link

未单击访问时超链接样式

a:link{color:#9ef5f9;}

a:visited

单击访问后超链接样式

a:visited {color:#333;}

a:hover

鼠标悬浮其上的超链接样式

a:hover{color:#ff7300;}

a:active

鼠标单击未释放的超链接样式

a:active {color:#999;}

列表样式:

说明

语法示例

none

无标记符号

list-style-type:none;

disc

实心圆,默认类型

list-style-type:disc;

circle

空心圆

list-style-type:circle;

square

实心正方形

list-style-type:square;

decimal

数字

list-style-type:decimal

网页背景:

背景颜色:background-color           

背景图像:background-image     

 

实例repeat-x

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
a{
background-image: url(1.jpg);
background-repeat:repeat-x;
font-size: 1000px;
}
</style>
<title></title>
</head>
<body>
<a href="">课本</a>
</body>
</html>

渐变

div{

150px;

height:70px;

background:linear-gradient(red,blue)  默认的从上到下

}

div{

150px;

height:70px;

background:linear-gradient(to right ,red,blue)  从左往右

}

原文地址:https://www.cnblogs.com/cxd1996/p/10120543.html