css文字样式
来源:互联网 发布:医疗器械分类数据库 编辑:程序博客网 时间:2024/04/26 08:02
1,设置字体:
css中字体通过font-family属性来控制。font-family属性属性可以同时声明多种字体,字体之间用逗号隔开。如:
p { font-family:Arial,"Times New Roman"; }
注意:如字体由多个单词组成,单词之间要用空格隔开,而且还要用双引号将其括起来,使浏览器知道这是一种字体的名称。如上面的Times New Roman。
2,文字大小:
css中文字大小通过font-size属性来控制。如:
p { font-size:12px; }
此外,还有两个特殊的长度单位:em和xm。1em表示的长度是其父元素中字母m的标准宽度,1ex则表示字母x的标准高度。
通过对em的设置可以实现下沉显示的效果。如:
<html>
<head>
<title>FontTest</title>
<style type="text/css">
.p2{font-size:2em;float:left;}
</style>
<body>
<title>Home Town</title>
<p><span class="p2"> H</span>enan has a humid warm-temperate
climate.Dry and windy in winter and spring, the province
is hot and rainy in summer and bakes in strong sunlight
during the autumn months. Rainfall averages about 600-1000
millimeters increasing from north to south, as does the
annual temperature which increases from about 12.8C in the
north to 15.5C in the south.
</p>
</body>
</html>
在浏览器上显示的结果为“H”下沉。
3,行高:
4,文字的颜色和背景:
在html页面中,颜色统一采用RGB格式,也就是“红绿蓝”三原色。范围:(0%~100%)、(0~255)、(#000000~#ffffff)。
以下几种方法都可以将文字设置为红色:
p{ color:red;}
p{color:#ffoooo;}
p{color:rgb(255,0,0);}
p{color:rgb(100%,0%,0%);}
设置背景颜色的属性为:background-color。如背景设为红色:
p{ background-color:#ff0000;}
5,文字加粗、倾斜、大小写:
控制文字粗细的属性为font-weight;
font-weight:normal; /*正常*/
font-weight:bold; /*加粗*/
控制文字倾斜的属性为:font-style;
font-style:normal; /*正常字体*/
font-style:oblique; /*倾斜体*/
font-style:italic; /*意大利体*/
控制文字大小写的属性为text-transform;
p.one{text-transform:capitalize;} /*单词首字大写*/
p.two{text-transform:uppercase;} /*全部大写*/
p.three{text-transform:lowercase;} /*全部小写*/
6,文字的装饰效果:
css通过设置文字的text-decoration属性来实现特殊效果:
p.one{text-decoration:underline;} /*下划线*/
p.two{text-decoration:line-through;} /*删除线*/
p.three{text-decoration:overlin;} /*顶划线*/
p.four{text-decoration:blink;} /*闪烁*/
闪烁在IE中无效,在Firefox中有效。
说明:几种属性可以同时实现,中间有空格隔开。
以下为练习笔记:
<html>
<head>
<title>FontTest</title>
<style type="text/css">
.p1{font-size:18px;}
.p2{font-size:2em;float:left;}
.p3{line-height:24px}
.p4{color:#ff0000;}
.p5{text-decoration:underline;}
.p6{text-decoration:overline;}
.p7{text-decoration:line-through;}
.p8{text-decoration:blink;}
.p9{font-style:italic;}
.p10{background:#fff0ac;}
</style>
<body>
<title>Home Town</title>
<p class="p7 p10"><span class="p2"> H</span>enan has a humid warm-temperate climate.
Dry and windy in winter and spring, the province
is hot and rainy in summer and bakes in strong sunlight
during the autumn months. Rainfall averages about 600-1000
millimeters increasing from north to south, as does the
annual temperature which increases from about 12.8C in the
north to 15.5C in the south.
</p>
<p class="p1 p3 p4 p5 p9">enan province is considered the cradle of Chinese
civilization due to its location on the Yellow River.
This rich historic heritage has endowed Henan with
numerous historic treasures, from primitive dwellings
to earliest wheel thrown pottery.
</p>
</body>
</html>
- CSS样式 文字样式
- CSS文字样式
- CSS的文字样式
- CSS文字样式
- css文字样式
- CSS文字样式
- CSS基本文字样式
- 【CSS】文字样式
- (7)-HTML5-CSS文字样式
- css样式实现过长文字...
- CSS样式 --- 文字样式 【时刻更新】
- CSS样式——文字样式
- css 样式文字溢出显示省略号
- 用CSS控制超链接文字样式
- CSS a 控制超链接文字样式
- 图片与文字对齐css样式
- CSS设置字体和文字样式
- css 样式文字溢出显示省略号
- 【effective c++读书笔记】【第1章】让自己习惯C++
- vs2005 出现由于应用程序配置不正确,未能启动此应用程序,请查看清单文件....
- Property Animation 源码学习
- Unity5中Inspector界面上的AssetBundle值设定问题
- Power Network
- css文字样式
- 黑马程序员——Java基础——异常体系
- 【语言-C++】MD5加密算法 32bit 16bit 源码
- Https流程(简单认识)
- 黑马程序员--反射Reflect
- BIEE初次启动密码输入错误
- 软件项目的开发步骤(图)
- IOS应用之间的跳转和数据传
- qtableview和qtablewidget区别