css字体样式+文本样式
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字体样式+文本样式的更多相关文章
- CSS(2)---css字体、文本样式属性
css字体.文本样式属性 这篇主要讲CSS文本属性中的:字体样式属性 和 文本样式属性. 一.字体样式属性 CSS 字体属性主要包括:字体设置(font-family).字号大小(font-size) ...
- 【CSS学习】--- 文本样式
一.前言 CSS文本属性可以定义文本的外观.通过文本属性,可以定义文本的颜色.字符间距,对齐文本,装饰文本,对文本进行缩进,等等. CSS常用的文本属性目录: text-align 文本对齐属性 te ...
- CSS: CSS常用的文本样式属性
介绍:CSS常用的文本样式属性 color: 颜色 font-size: 字体大小 font-style (normal.italic.oblique): 字体样式(正常.斜体) font-wei ...
- css 字体、文本、padding的样式
一.字体的样式: 1)字体倾斜:font-style:italic 2)字体大小:font-size 一般为偶数. 3)行高:line-height 当行高为奇数的时候,是文字上面比文字下面的少一 ...
- css 基础 字体和文本样式
字体样式处理font-size:30px:// 设置字体大小 font-weight:700://设置粗体 font-sytle:italic; //设置文字斜体 font-family: 斜体,宋体 ...
- [Web 前端] 009 css 常用的文本样式设置
常用的文本 css 样式 概览 参数 释义 举例 color 设置文字的颜色 color:red; font-size 设置文字的大小 font-size:12px; font-family 设置文字 ...
- 前端之CSS字体和文本类属性
一.字体类属性: 1.字体类型: font-family:字体1,字体2,字体3; 常用写法: font-family:"微软雅黑",Arial; 注:a) 多个字体之间用逗号分隔 ...
- CSS颜色、单位、文本样式
一.CSS颜色:关键字 red16进制的6位 #ffffff16进制的3位 #fffrgb(0,255,100) 取值范围:0~255 (r:red.g:green.b:blue)rgba(0,255 ...
- 7. CSS装饰网页的样式
CSS中有哪些用来装饰网页的样式呢?在这里我们对一些常用的样式做了总结. 字体样式 /* * 一般样式书写 */ .font_style_1{ font-family: "华文行楷" ...
随机推荐
- static静态变量在c++类中的应用实例
这个static 如果写在类中,那么就可以得到一个局部的静态变量,也就是说可以实现在类内保存某个特殊值不随函数释放而消失的作用.应用中由于赋初值的位置不对而报错,错误提示为:“无法解析外部符号 ... ...
- .net core3.1 webapi + element-ui upload组件实现文件上传
首先,先看我个人的的项目结构. 这个webapi项目是专门用来做图片上传,其中分为两个控制器:单图片上传和多图片上传.而我接下来主要讲的还是单文件上传,对于多文件的上传,我暂且尚未研究成功. 其中pi ...
- sass css样式:@for循环、样式变量与#{} 变量插值
/* sass 可以用写JS的思想来写CSS代码 * #{} 用来插值,大括号中填写需要插入的变量 * @for 变量 from ...
- 3万字总结,Mysql优化之精髓
本文知识点较多,篇幅较长,请耐心学习 MySQL已经成为时下关系型数据库产品的中坚力量,备受互联网大厂的青睐,出门面试想进BAT,想拿高工资,不会点MySQL优化知识,拿offer的成功率会大大下降. ...
- windows 通过AppInit加载任意dll
windows操作系统允许将用户提供的dll加载到所有的进程的内存空间中.该功能可以用来做后门持久化.有点类似于linux的ld_preload环境变量.在进程启动的时候,操作系统会将用户提供的dll ...
- Struts(五)
前端和后端验证 1.前端:用户体验 2.保证程序的安全性 ================================验证框架========================== ...
- pugixml简单实用
实现快递查询,调用快递100的API,未完成. #include <iostream> #include <fstream> #include <string> # ...
- [python之路]简单介绍
python介绍 #python是一个什么样的语言?编译型和解释型静态语言和动态语言强类型定义语言和弱类型定义语言python是一门动态解释性的强类型定义语言. #Python的优缺点##优点Pyth ...
- C++ STL——优先队列的结构体表示方法
优先队列是队列的一种,但是自身具有一定的排序功能,所以不具有队列“先进先出”的性质 刚刚接触优先队列,看过网上的用法后感觉还是太过于朦胧,所以打算自己写一个稍微细节一点的. 头文件 #include& ...
- Mysql设置创建时间字段和更新时间字段自动获取时间,填充时间
1.引言在实际开发中,每条数据的创建时间和修改时间,尽量不需要应用程序去记录,而由数据库获取当前时间自动记录创建时间,获取当前时间自动记录修改时间. 2.创建语句(1)–添加CreateTime 设置 ...