CSS字体属性大全
文章转自:http://www.10wy.net/Article/CSS/CSS_list_8.html
查看更多更专业性的文章请到:网页设计网
CSS字体属性
字体名称属性(font-family)
这个属性设定字体名称,如Arial, Tahoma, Courier等。例句如下:
.s1 {font-family:Arial}
演示示例
字体大小属性(font-size)
这个属性可以设置字体的大小。字体大小的设置可以有多种方式,最常用的就是pt和px(pixel)。例句如下:
.s2 {font-size:16pt}
演示示例
字体风格属性(font-style)
这个属性有三个值可选:normal, italic, oblique。normal是缺省值,italic, oblique都是斜体显示。例句如下:
.s1 {font-sytle:italic}
演示示例
字体浓淡属性(font-weight)
这个属性常用值是normal和bold,normal是缺省值。例句如下:
<p style = "font-weight:bold">这段文字字体的浓淡属性(font-weight)值是bold。<p>
演示示例
字体变量属性(font-variant)
这个属性有两个值,normal和small-caps,normal是缺省值。small-caps表示小的大写字体。例句如下:
.s1 {font-variant:small-caps}
演示示例
字体属性(font)
这个属性是各种字体属性的一种快捷的综合写法。这个属性可以综合字体风格属性(font-style),字体变量属性(font-variant),字体浓淡属性(font-weight),字体大小属性(font-size)等属性。例句如下:
.s1 {font:italic normal bold 11pt arial}
演示示例
字体颜色(color)
文章转自:http://www.10wy.net/Article/CSS/CSS_list_8.html
查看更多更专业性的文章请到:网页设计网
CSS常用文本属性
文本对齐属性(text-align)
这个属性用来设定文本的对齐方式。有以下值:
· left (居左,缺省值)
· right (居右)
· center (居中)
· justify (两端对齐)
示例代码如下:
.p2 {text-align:right}
演示示例
文本修饰属性(text-decoration)
这个属性主要设定文本划线的属性。有以下值:
· none (无,缺省值)
· underline (下划线)
· overline (上划线)
· line-through (当中划线)
示例代码如下:
.p2 {text-decoration: underline}
演示示例
文本缩进属性(text-indent)
这个属性设定文本首行缩进。其值有以下设定方法:
· length (长度,可以用绝对单位(cm, mm, in, pt, pc)或者相对单位 (em, ex, px))
· percentage (百分比,相当于父对象宽度的百分比)
示例代码如下:
.p1 {text-indent: 8mm}
演示示例
行高属性(line-height)
这个属性设定每行之间的距离。其值有以下设定方法:
· normal (缺省值)
· length (长度,可以用绝对单位(cm, mm, in, pt,pc)或者相对单位 (em, ex, px))
· percentage (百分比,相当于父对象高度的百分比)
示例代码如下:
.p1 {line-height:1cm}
演示示例
字间距属性(letter-spacing)
这个属性用来设定字符之间的距离。
· normal (缺省值)
· length (长度,可以用绝对单位(cm, mm, in, pt, pc)或者相对单位 (em, ex, px))
示例代码如下:
.p1 {letter-spacing: 3mm}
演示示例
颜色属性(color)
用颜色属性(color)可以改变文本的字体颜色。字体颜色代码请参见HTML颜色参考(HTML Color Reference)。示例代码如下:
.p1{color:gray}
演示示例
文章转自:http://www.10wy.net/Article/CSS/CSS_list_8.html
查看更多更专业性的文章请到:网页设计网
CSS背景属性
背景颜色属性(background-color)
这个属性为HTML元素设定背景颜色,相当于HTML中bgcolor属性。
body {background-color:#99FF00;}
上面的代码表示Body这个HTML元素的背景颜色是翠绿色的。
演示示例
背景图片属性(background-image)
这个属性为HTML元素设定背景图片,相当于HTML中background属性。
<body style="background-image:url(../images/css_tutorials/background.jpg)">
上面的代码为Body这个HTML元素设定了一个背景图片。
演示示例
背景重复属性(background-repeat)
这个属性和background-image属性连在一起使用,决定背景图片是否重复。如果只设置background-image属性,没设置background-repeat属性,在缺省状态下,图片既横向重复,又竖向重复。
· repeat-x 背景图片横向重复
· repeat-y 背景图片竖向重复
· no-repeat 背景图片不重复
body {background-image:url(../images/css_tutorials/background.jpg); background-repeat:repeat-y}
上面的代码表示图片竖向重复。
演示示例
背景附着属性(background-attachment)
这个属性和background-image属性连在一起使用,决定图片是跟随内容滚动,还是固定不动。这个属性有两个值,一个是scroll,一个是fixed。缺省值是scroll。
body {background-image:url(../images/css_tutorials/background.jpg); background-repeat:no-repeat; background-attachment:fixed}
上面的代码表示图片固定不动,不随内容滚动而动。
文章转自:http://www.10wy.net/Article/CSS/CSS_list_8.html
查看更多更专业性的文章请到:网页设计网
CSS字体属性大全的更多相关文章
- CSS字体属性
CSS字体属性 CSS Fonts(字体)属性拥有定义字体系列.大小.粗细和文字样式(如斜体) 字体系列 <style type="text/css"> div{ fo ...
- 3.CSS字体属性
CSS Fonts(字体)属性用定义字体系列,大小粗细,和文字样式(如斜体) 3.1字体系列 CSS使用font-family属性定义文本字体系列 p { font-family:'微软雅黑' ;} ...
- CSS字体属性与文本属性
CSS字体属性与文本属性 1. 字体属性 1.1 字体系列font-family p { font-family: "Microsoft Yahei";/*微软雅黑*/ } /*当 ...
- css 参考属性大全
动画属性 属性 描述 CSS @keyframes 定义一个动画,@keyframes定义的动画名称用来被animation-name所使用. 3 animation 复合属性.检索或设置对象所应用的 ...
- css字体属性(font)
字体名称属性(font-family) 这个属性设定字体名称,如Arial, Tahoma, Courier等.例句如下: .s1 {font-family:Arial} 字体大小属性(fon ...
- CSS字体属性 font属性
CSS的所有字体属性: ·-· font 在一个声明中设置所有的字体属性 ·-· font-family 指定文本的字体系列 ·-· font-size 指定文本的字体大小 (属性值是整数字, ...
- 所有CSS字体属性
font(在一个声明中设置所有的字体属性) font-family(指定文本的字体系列) font-size(指定文本的字体大小) font-style(指定文本的字体样式) font-variant ...
- css字体属性相关。
出处:CSS 参考手册 http://www.w3school.com.cn/cssref/index.asp text-decoration 属性 说明:这个属性允许对文本设置某种效果,如加下 ...
- 解决谷歌浏览器设置font-family属性不起作用,(css中设置了font-family:没有用)css字体属性没用
嗯,这个问题百思不得解.其他的浏览器器都没问题,在谷歌上就不行,网上找了很多,都没效果,后才发现,当然同样的问题可能错不一样的地方,我的解决方案: 感觉主要原因是自己也没查到,乱改一堆,就OK啦: 1 ...
随机推荐
- YUM仓库服务
YUM仓库服务 大纲 1部署yum软件仓库 1.1 准备网络安装源(服务器端) 1.2 配置软件仓库位置(客户机端) 1部署yum软件仓库 借助于YUM软件仓库,可以完成安装.卸载.自动升级rpm ...
- DISCUZ官方论坛模仿开发日志(二)
接上一次日志:http://www.cnblogs.com/gcs1995/p/4091159.html 从上次写下项目简要分析到现在差不多两个月时间了,这两个月时间学习了很多新技术: 数据库技术: ...
- 可拖拽和带预览图的jQuery文件上传插件ssi-uploader
插件描述:ssi-uploader是一款带预览图并且可以拖拽文件的jQuery ajax文件上传插件.该文件上传插件支持AJAX,支持多文件上传,可控制上的文件格式和文件大小,提供各种回调函数,使用非 ...
- TestNG中的数据源DataProvider概述
http://blog.csdn.net/taiyangdao/article/details/52141711 在上一篇文章中,我们知道带参数的测试方法,可以在testng.xml配置文件中为其参数 ...
- 规则“Windows Server 2003 FILESTREAM 修补程序检查” 失败。
近期在客户环境搭建SQL故障转移群集,操作系统为SQL Server 2012R2,数据库版本为SQL Server2008 R2,在安装过程中遇到问题:没有安装Windows Server 2003 ...
- [官方软件] Easy Sysprep v4.3.29.602 【系统封装部署利器】(2016.01.22)--skyfree大神
[官方软件] Easy Sysprep v4.3.29.602 [系统封装部署利器](2016.01.22) Skyfree 发表于 2016-1-22 13:55:55 https://www.it ...
- 20个人艰不拆的事实:知道真相的我眼泪掉下来 T.T
20个人艰不拆的事实:知道真相的我眼泪掉下来 T.T 原文链接http://www.u148.net/article/113612.html 来源:ruoning WuMo是丹麦画家Mikael Wu ...
- 如何让nginx显示文件夹目录
1. 如何让nginx显示文件夹目录 vi /etc/nginx/conf.d/default.conf 添加如下内容: location / { root /data/www/f ...
- 关于 XMLHttpRequest对象的onreadyStateChange方法
最近做了一个Ajax的demo,前台用HTML+javascript,后台用一个servlet来响应,流程如下: 页面点击链接事件,由js捕获,生成一个请求到后台,servlet处理后给出响应信息,并 ...
- Anaconda died after receiving signal 7
安装RHEL6-64时出现如下提示 Anaconda died after receiving signal 7 1 Anaconda是啥 是RedHat.CentOS.Fedora等Linux的安装 ...