html css代码6,html(6)css2(示例代码)

1.会使用CSS设置字体样式

font-family:字体类型

font-size:字体大小

font-weight:字体粗细(bold)

font-style:字体倾斜(italic)

font:倾斜 粗细 大小 类型

若需要同时设置英文字体和中文字体时，必须把英文字体设置在中文字体前，否则英文字体设置将不起作用

2.会使用CSS设置文本样式

1) 文本颜色：color

2)水平对齐方式：text-align:  left \\center \\right \\ justify两端对齐

(图片的对齐)使用ID选择器或类选择器

3)垂直对齐方式：vertical-align:   top\\middle\\bottom;

(图片的对齐)p img { vertical-align:  top\\middle\\bottom }

4)段落标记中，用于缩进：text-indent:  数字em;

1em，代表一个汉字的宽度

5)文本的行高：line-height：数字px；

6)文本装饰(上划线、删除线、下划线)：

text-decoration:  overline 上划线 underline下划线 line-through

none默认值，定义的标准文本

blink设置文本闪烁，只在Firefox浏览器中有用，在IE中无效。

3.会使用CSS设置图片对齐方式

垂直对齐方式：vertical-align:top\\middle\\bottom;

会使用CSS设置超链接样式

超链接的文字

标签选择器

伪类样式：

设置伪类样式的顺序：link> visited> hover active

伪类名称

含义

示例

a:link

未单击访问时超链接样式

a:link{color:#9EF5F9}

a:visited

单击访问后超链接样式

a:visited{ color:#333}

a:hover

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

a:hover{ color:#FF7300}

a:active

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

a:active{ color:#999}

4.会使用CSS设置鼠标外观——cursor

值

说明

图例

default

默认光标

↖

pointer

超链接的指针

wait

指示程序正在忙

help

指示可用的帮助

text

指示文本

crosshair

鼠标呈十字状

5.Div标签

1、 作用:  目前流行的网页布局的方式：div+css

2、          

放文字、图片、超链接等等

3、          让div显示出来，设置哪些css样式属性？

a.　　宽——width             高——height

b.     设置边框border：边框粗细 边框样式 边框颜色

c.     实线细边框——solid              虚线边框——dashed

6.会使用CSS设置背景样式

背景颜色：background -color

背景图片：background -image

背景重复方式：background -repeat

背景图片定位：background –position

7.会使用CSS设置列表样式

修改列表的符号：list-style-type

自定义列表的图片：list-style-image

列表项标记的位置：list-style-position：inside(文本内且环绕文本根据标记对齐)，

outside(默认值，位于文本左侧，放在文本以外，且环绕文本不根据标记对齐)