千锋和蓝欧html5,蓝鸥零基础学习HTML5第六讲 CSS的常见样式

CSS的常见样式

1.css文本样式的设置

html>

Document

div {

font-size:160px;

font-family: "sans-Serif";

color:rgb(41,232,32);

}

蓝鸥科技 lanou

2.line-height

html>

Document

div {

border:1px solid red;

height:100px;

line-height: 100px;

}

我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面我今天晚上吃炸酱面

3.text-align

html>

Document

div {

width:200px;

height:200px;

line-height: 200px;

border:1px solid red;

text-align: center;

}

蓝鸥科技

4.text-indent

html>

Document

div {

border: 1px solid red;

font-size:20px;

line-height: 25px;

text-indent: 40px;

}

近日，一则深圳汽车起火爆炸的新闻引起网友的关注。经初步调查，起火汽车的车主一家三口刚从万科红开车回家，停在路边不到三分钟就起火，车头烧毁严重，没有人员伤亡，起火原因正在进一步调查当中。事情是怎么一回事呢？7月17日凌晨，深圳龙岗区布吉湖西路的一辆汽车，在刚停好不到三分钟就突然起火，幸好车主一家三口已离开，否则后果不堪设想。

5.font-weight

html>

Document

div {

font-size: 50px;

font-weight: bold;

}

蓝鸥科技

6.font-style

html>

Document

div {

font-size:50px;

/*font-style:oblique;*/

}

em {

font-size:50px;

font-style: normal;

}

蓝鸥科技

蓝鸥科技

7.text-decoration

html>

Document

div {

font-size:50px;

text-decoration: none;

}

a {

text-decoration: none;

}

100元RMB

蓝鸥科技

8.letter-spacing

html>

Document

div {

font-size:50px;

letter-spacing: 10px;

word-spacing: 100px;

}

蓝鸥科技 蓝鸥科技 i love you

9.复合样式

html>

Document

div {

width:500px;

height:500px;

background: red url("img/1.jpg") 100px 100px no-repeat;

border: 10px solid yellow;

padding:10px 20px 30px 40px ;

margin:20px 40px 80px 160px ;

font: italic bold 50px/500px "stkaiti";

}

蓝鸥科技

10.样式继承

html>

Document

#box1 {

color:red;

font-size:50px;

text-decoration: underline;

border:1px solid red;

padding:100px;

}

a {

color:red;

}

蓝鸥科技

就是牛逼

我是A标签

11、Font-family资料

font-family可以取的值

宋体 SimSun

黑体 SimHei

微软雅黑 Microsoft YaHei

微软正黑体 Microsoft JhengHei

新宋体 NSimSun

新细明体 PMingLiU

细明体 MingLiU

标楷体 DFKai-SB

仿宋 FangSong

楷体 KaiTi

仿宋_GB2312 FangSong_GB2312

楷体_GB2312 KaiTi_GB2312

宋体：SimSuncss中中文字体(font-family)的英文名称

Mac OS的一些：

华文细黑：STHeiti Light [STXihei]

华文黑体：STHeiti

华文楷体：STKaiti

华文宋体：STSong

华文仿宋：STFangsong

儷黑 Pro：LiHei Pro Medium

儷宋 Pro：LiSong Pro Light

標楷體：BiauKai

蘋果儷中黑：Apple LiGothic Medium

蘋果儷細宋：Apple LiSung Light

Windows的一些：

新細明體：PMingLiU

細明體：MingLiU

標楷體：DFKai-SB

黑体：SimHei

新宋体：NSimSun

仿宋：FangSong

楷体：KaiTi

仿宋_GB2312：FangSong_GB2312

楷体_GB2312：KaiTi_GB2312

微軟正黑體：Microsoft JhengHei

微软雅黑体：Microsoft YaHei

装Office会生出来的一些：

隶书：LiSu

幼圆：YouYuan

华文细黑：STXihei

华文楷体：STKaiti

华文宋体：STSong

华文中宋：STZhongsong

华文仿宋：STFangsong

方正舒体：FZShuTi

方正姚体：FZYaoti

华文彩云：STCaiyun

华文琥珀：STHupo

华文隶书：STLiti

华文行楷：STXingkai

华文新魏：STXinwei