font-family属性值:具体字体名或者字体集

如果是中文或者有单词之间有空格,需要加双引号

字体集:

Serif (有装饰线)

Sans-serif (无装饰线)

Monospace

Cursive

Fantasy

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
h1{
font-family: "Times New Roman";
}
p{
font-family: "微软雅黑","宋体","黑体",sans-serif;
}
</style>
</head>
<body>
<h1>css层叠样式表</h1>
<p>什么是css层叠样式表呢?</p>
</body>
</html>

font-size 相对单位

px (受显示器分辨率影响,在手机端一般不使用)

em (针对父元素)

% (针对父元素)

字体颜色

可查询web安全色

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
/*rgb数字:0~255*/
h1{
color:rgb(0,255,0);
}
/*rgb百分比:0%~100%*/
p{
color:rgb(0%,100%,0%);
}
p.spe{
color:#008800;/*#开头,六位,0~F*/
color:#080;/*简写*/
}
</style>
</head>
<body>
<h1>css层叠样式表</h1>
<p>什么是css层叠样式表呢?</p>
<p class="spe">颜色十六进制</p>
</body>
</html>

font-variant:small-caps 小型大写字母

css文本样式

text-align 只对块级元素有效:可以在元素外嵌套块级元素,给外元素添加text-align属性

margin:0 auto; 也可以设置元素居中显示

line-height

实际开发中,行高一般使用em单位,与字体大小相关

浏览器默认行高一般是1.2em

行高可以继承自父元素,继承的是计算后的值,而不是直接继承百分比

首行缩进 text-indent

vertical-align 对行内元素或者单元格元素生效

可以用在图片上 vertical-align:middle;

或者可以用具体的数值

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.wrap{
height:400px;
width:500px;
border:1px solid;
display: table;/*转为表格元素*/
}
.content{
vertical-align: middle;
text-align:center;
display: table-cell;/*转为单元格元素*/
}
</style>
</head>
<body>
<div class="wrap">
<div class="content">
<p>什么是<span class="sub">css</span>层叠样式表呢?</p>
<p>什么是<span class="super">css</span>层叠样式表呢?</p>
</div>
</div> </body>
</html>

word-spacing 单词间距

letter-spacing 字母间距

单词的判断以空格为准

text-transform:capitalize | uppercase | lowercase | none 设置文字大小写

text-decoration:underline | line-through | overline | none 设置文字装饰线

也可以设置多个样式 text-decoration:underline overline;

css字体样式+文本样式的更多相关文章

  1. CSS(2)---css字体、文本样式属性

    css字体.文本样式属性 这篇主要讲CSS文本属性中的:字体样式属性 和 文本样式属性. 一.字体样式属性 CSS 字体属性主要包括:字体设置(font-family).字号大小(font-size) ...

  2. 【CSS学习】--- 文本样式

    一.前言 CSS文本属性可以定义文本的外观.通过文本属性,可以定义文本的颜色.字符间距,对齐文本,装饰文本,对文本进行缩进,等等. CSS常用的文本属性目录: text-align 文本对齐属性 te ...

  3. CSS: CSS常用的文本样式属性

    介绍:CSS常用的文本样式属性 color:  颜色 font-size:  字体大小 font-style (normal.italic.oblique): 字体样式(正常.斜体) font-wei ...

  4. css 字体、文本、padding的样式

    一.字体的样式: 1)字体倾斜:font-style:italic 2)字体大小:font-size 一般为偶数. 3)行高:line-height   当行高为奇数的时候,是文字上面比文字下面的少一 ...

  5. css 基础 字体和文本样式

    字体样式处理font-size:30px:// 设置字体大小 font-weight:700://设置粗体 font-sytle:italic; //设置文字斜体 font-family: 斜体,宋体 ...

  6. [Web 前端] 009 css 常用的文本样式设置

    常用的文本 css 样式 概览 参数 释义 举例 color 设置文字的颜色 color:red; font-size 设置文字的大小 font-size:12px; font-family 设置文字 ...

  7. 前端之CSS字体和文本类属性

    一.字体类属性: 1.字体类型: font-family:字体1,字体2,字体3; 常用写法: font-family:"微软雅黑",Arial; 注:a) 多个字体之间用逗号分隔 ...

  8. CSS颜色、单位、文本样式

    一.CSS颜色:关键字 red16进制的6位 #ffffff16进制的3位 #fffrgb(0,255,100) 取值范围:0~255 (r:red.g:green.b:blue)rgba(0,255 ...

  9. 7. CSS装饰网页的样式

    CSS中有哪些用来装饰网页的样式呢?在这里我们对一些常用的样式做了总结. 字体样式 /* * 一般样式书写 */ .font_style_1{ font-family: "华文行楷" ...

随机推荐

  1. 五、spring源码阅读之ClassPathXmlApplicationContext加载beanFactory

    ApplicationContext applicationContext = new ClassPathXmlApplicationContext("spring-config.xml&q ...

  2. Nginx(3)---代理与负载均衡

    一.代理简述 代理分为正向代理和反向代理, 正向代理:客户端与目标服务器之间增加一个代理服务器,客户端直接访问代理服务器,在由代理服务器访问目标服务器并返回客户端并返回 .比如夜深人静的时候访问的一些 ...

  3. [求解!!!] springboot在运行web项目时报错

    2017-05-10 17:40:54.343 INFO 4852 --- [ main] ationConfigEmbeddedWebApplicationContext : Refreshing ...

  4. VS debug下为什么多此一举jmp函数地址?

    VS debug下为什么call 函数后,会jmp函数地址?多此一举? http://blog.csdn.net/viper/article/details/6332934 在写跑在main之前的时候 ...

  5. 《Python学习手册 第五版》 -第8章 列表与字典

    前面已经讲过数值类型(第5章)和字符串类型(第7章),本章继续其他数据类型的讲解:列表和字典 本章的核心内容 1.列表 1)什么是列表 2)基本列表操作 3)列表迭代和推导 4)索引.分片和矩阵 5) ...

  6. nmcli几个常用命令

    1.nmcli connection 用于查看连接 2.nmcli device用于查看当前网络设备 3.nmcli connection modify用于修改当前连接配置 4.nmcli conne ...

  7. Python3(十) 函数式编程: 匿名函数、高阶函数、装饰器

    一.匿名函数 1.定义:定义函数的时候不需要定义函数名 2.具体例子: #普通函数 def add(x,y): return x + y #匿名函数 lambda x,y: x + y 调用匿名函数: ...

  8. java 自学简单框架(反射+注解)

    1.先定义一个学生类 2.再定义一个teacher类(这个是为了练习多个注解,自己练习可以 不写这个) 3.再定义个一个学生老师类(这个是为了最终调用上面的那个学生类做准备) 4.下面开始真正的写框架 ...

  9. coat 彩色的cat

    # 和cat类似,但每一行一种颜色,方便查看 curl -o coat https://raw.githubusercontent.com/oldratlee/useful-scripts/maste ...

  10. python 安装pyinstaller

    pip install https://github.com/pyinstaller/pyinstaller/archive/develop.tar.gz