文档章节

CSS-字体格式化

wytao1995
 wytao1995
发布于 09/16 21:17
字数 421
阅读 10
收藏 0

一、字体属性

1、自定字体的类型

    font-family:黑体,华文彩云,宋体;

    用逗号隔开多个字体类型

2、字体大小

font-size

取值:(1)以px为单位的数字

        (2)以pt为单位的数字

        (3)em/rem

3、字体加粗

font-weight

取值:

    (1)bold 加粗

    (2)lighter 细一些

    (3)bolder 比粗更粗

    (4)normal 正常

    (5)value 无单位数字,可以取100的整倍数,100~1000之间

4、字体样式

    font-style

    取值:normal/italic

5、小型大写字母

font-variant

取值:small-caps/normal

6、字体的简写方式

font:style variant weight size family

至少要有size和family

二、文本格式化

1、字体颜色

color

取值:合法颜色值

2、文本排列(水平)

text-align

取值 left/center/right/justify(两端对齐)

3、文本排列方式(垂直),用行高写,只适用于单行文字

定义一行文字高度,如果行高大于字体本身的大小,该行文本将在指定的行高内,呈垂直居中

line-height

取值:

    (1)以px为单位的数字

    (2)无单位的数字,表示字体大小的倍数

4、线条的修饰

text-decoration

取值:

    overline:上划线

    underline:下划线

    line-through:删除线

    none:无线条

5、首行的缩进

text-indent:

取值:以px为单位的数字

6、文本阴影

text-shadow: 10px 10px 10px  red;

h-shadow:横向偏移量

v-shadow:纵向偏移量

blur:模糊距离

color:颜色

    

© 著作权归作者所有

上一篇: CSS--表格
下一篇: CSS--渐变
wytao1995
粉丝 1
博文 53
码字总数 33926
作品 0
六安
私信 提问
深入了解CSS字体度量,行高和vertical-align

本文英文出处:http: //iamvdo.me/en/blog/css-font-metrics-line-height-and-vertical-align 著作权归作者所有。 转载自https: //www.w3cplus.com/css/css-font-metrics-line-height-and-ver......

lecepin
2017/03/04
0
0
(转)8款在线CSS优化工具/组织和压缩CSS

CSS的优化通常包括两方面: 格式化CSS和精简CSS。 精简CSS的办法是把具有相同属性的元素合并在一起,但这会降低代码的可读性,使代码的后期维护很麻烦,稍不注意就出错。 格式化CSS一般就是多...

林文安
2012/05/17
35
0
对CSS初学者的一些建议

朋友要我改个HTML/CSS的代码,看了之后,提了以下建议: 1、最好是各种类型的资源文件分文件夹存放,如:style、images、js等; 2、不要所有的div都用id标识,不要再HTML里面写空的类,像cla...

曾沙
2012/10/17
884
12
10个便利的CSS代码在线生成器

CSS 代码编写是设计师的一个重要工作。写一个 CSS 代码和实施所需的设计任务。是非常不容易的,,今天给大家带来几个不错的工具,您可以生成在线 CSS 代码。节省您的时间,并自动获得一个专业...

桃源闲人
2012/04/02
525
0
符合W3C的网站的开发模型和必要性的探讨(二)

二、推荐的WebUI开发流程和模式 随着浏览器兼容性的问题越来越严重和得到关注,Web开发市场场终于出现了一个重要的角色和技术:UI。这个UI技术不再是关注所谓让页面炫耀的事情,而且关注页面...

彭博
2012/03/09
60
0

没有更多内容

加载失败,请刷新页面

加载更多

js如何控制table中的某一行动态置顶

两行代码搞定: $('#'+item.roadCode).fadeOut().fadeIn();//获取到需要置顶的行 $(".table").prepend($('#'+item.roadCode)); 其中,fadeOut()方法 作用 --- 从可见到隐藏 如下: prepend(......

码妞
今天
4
0
四种解决Nginx出现403 forbidden 报错的方法

我是在在本地用虚拟机中通过yum安装nginx的,安装一切正常,但是访问时报403, 于是查看nginx日志,路径为/var/log/nginx/error.log。打开日志发现报错Permission denied,详细报错如下: 1....

dragon_tech
今天
3
0
获取RestResultResponse返回的值

Springboot项目,需要调其他服务的接口,返回值类型是RestResultResponse 打断点的结果集是这个 打印出来的getData(): [{id=3336b624-8474-4dd9-bd5b-c7358687c877, paraNo=104, para=Postpo...

栾小糖
今天
4
0
【小学】 生成10以内的加减法

#!/usr/bin/env python# coding: utf-8from random import randrange# 题目的最大数值R_MAX = 10# 生成的题目的数量R_PAGE = 70# 生成减法列表def get_sub_list():...

Tensor丨思悟
今天
11
0
JavaScript设计模式——适配器模式

  适配器模式是设计模式行为型模式中的一种模式;   定义:   适配器用来解决两个已有接口之间不匹配的问题,它并不需要考虑接口是如何实现,也不用考虑将来该如何修改;适配器不需要修...

有梦想的咸鱼前端
今天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部