字体样式font-style
font-family
指的是字体比如 “宋体”,“微软雅黑”等等
具体字体:微软雅黑、宋体、黑体、宋体等等
字体系列:sans-serif、serf、monospace等
常见字体系列(了解):
1 无衬线字体(sans-serif)
特点:文字笔画粗细均匀,并且首尾无装饰
使用场景:网页中大多采用无衬线字体
常见该系列字体:黑体、Arial
2 衬线字体(serif)
特点:文字笔画粗细不均匀,并且首尾有笔锋装饰
使用场景:报刊书籍中广泛应用
常见该系列字体:宋体、Times New Roman
3 等宽字体(monospace)
特点:每个字母或文字的宽度相等
使用场景:一般用于程序代码编写,有利于代码的阅读和编写
常见该系列字体:Consolas、fira code
渲染规则:
1 从左到右,如果电脑未安装该字体,则显示下一个
2 如果都不支持,电脑会根据操作系统显示默认字体
注意:
1 如果字体名称中存在多个单词,推荐使用引号包裹
2 最后一项字体系列不需要引号包裹
3 网页开发时,尽量使用常见字体,保证不同浏览器显示正常
font-style
指定的是字体倾斜与否,italic 属性值是通过字体本身倾斜,oblique 属性值让字体倾斜一定角度,看起来效果一样,但是对于有些字体,可能原先不能倾斜,所以设置 italic 属性值不生效,设置成 oblique 就生效了。它的值有:normal(默认值)、italic(斜体)、oblique(倾斜)
font-weight
定义了字体的宽度,属性值 lighter细,bold粗,bolder更粗,当然也可以设置具体数值100~900,只能是整百。
关键字 normal(正常) bold(加粗)
纯数字 100~900的整百数 400(正常) 700(加粗)
font-variant
此属性的作用就是将文字转换成大写后缩小
font-size
数字+px,谷歌浏览器默认文字大小为16px,单位需要设置,否则无效。
字体样式font-style的更多相关文章
- css字体样式(Font Style),属性
css字体样式(Font Style),属性 css字体样式(Font Style)是网页中不可或缺的样式属性之一,有了字体样式,我们的网页才能变得更加美观,因此字体样式属性也就成为了每一位设计者 ...
- css文本样式text、字体样式font
文本样式text 1.文本颜色color 例如h1 {color:red;} 2.文本方向direction,不常用 默认ltr从左到右,rtl表示从右到左 3.文本水平对齐方式text-align ...
- css 字体样式设置大全
css样式大全(整理版) 字体属性:(font) 大小 {font-size: x-large;}(特大) xx-small;(极小) 一般中文用不到,只要用数值就可以,单位:PX.PD 样式 { ...
- css 字体样式设置
css字体样式(Font Style),属性 时间:2014-05-08 21:49 来源:我爱学习网 | 作者:我爱学习网 | 本文已影响 68353 人 css字体样式(Font Style) ...
- css字体样式
css字体样式(Font Style) 属性 css文本样式 序号 中文说明 标记语法 1 字体样式 {font:font-style font-variant font-weight f ...
- vue 动态添加 <style> 样式 vue动态添加 绑定自定义字体样式
created(){ //动态添加自定义字体样式 let style = document.createElement('style'); style.type = "text/css&qu ...
- Python 45 长度及颜色单位 、字体样式 、文本样式 、背景样式 、css基础选择器
一:长度及颜色单位 长度单位 px(像素) in(英寸) pt(点),一个标准的长度单位,1pt = 1/72in mm(毫米) cm ...
- 常见CSS3选择器和文本字体样式汇总
常见的CSS3选择器包含:常用基本.属性.伪类.层级(组合)选择器,具体使用情况建议先阅读css选择器四大类:基本.组合.属性.伪类对于选择器的使用有一个基本了解,选择器的作用在于通过它找到元素,并且 ...
- CSS3初学篇章_3(属性选择符/字体样式/元素样式)
属性选择符 选择符 说明 E[att] 选择具有att属性的E元素. E[att="val"] 选择具有att属性且属性值等于val的E元素. E[att~=&quo ...
- css常用样式font控制字体的多种变换
CSS 字体属性定义文本的字体系列.大小.加粗.风格(如斜体)和变形(如小型大写字母)font-family控制字体,由于各个电脑系统安装的字体不尽相同,但是基本装有黑体.宋体与微软雅黑这三款字体,通 ...
随机推荐
- P9033题解
P9033「KDOI-04」XOR Sum 题解 题目链接 传送门 题意简述 构造一个长度为 \(n\),值域为 \([0,m]\) 的异或和为 \(k\) 的序列,如果不存在则输出 \(-1\). ...
- 第1关—print()函数与转换
Print()函数的用法有以下几种:单枪匹马--不带引号.搭配单引号.搭配双引号.搭配三引号,我们逐个见识下吧! 1.无引号 注意,这里的括号一定要用[英文括号],不然会报错 impor ...
- rocketmq-exporter部署(干货)
简单介绍 rocketmq_exporter是prometheus提供的用于监控rocketmq运行状态的exporter 环境 系统 版本 CentOS 7.6.1810 (Core) CPU/内存 ...
- react 本地 DevServer启动之后找不到静态资源404
起因:更改路由嵌套方式,基础路径不是 '/' 本地启动项目之后 请求静态资源404,前边加了路由路径, 原因:打包之后相对路径改变了,解决:在output里的publicPath :'/'
- 【实验】B站资源免费下载技巧you-get
搭建环境, python pip3 install you-get 查看可以下载格式 you-get -i https://www.bilibili.com/video/BV1yN411d7KH?p ...
- mybatis中多条件模糊查询不显示数据的问题
在写查询语句时:
- 何同学新视频火了!找到减少沉迷手机的最佳方法:附免费APP
以优质原创视频吸引百万粉丝的 Up 主"何同学"昨晚(1 月 6 日)上线了最新作品,探讨了如何有效地减少现代人使用或者说沉迷手机的时间. 在视频开头,何同学提到,整理了 5000 ...
- vue+vant-ui移动端适配 宽高
一:在vue中安装vant 1.npm i vant -S 2.npm i babel-plugin-import -D // 在.babelrc 中添加配置 { "plugins" ...
- vue学习之-----组件递归调用
1.关键点 2.父组件 <template> <div> <div class="btn-title"> <el-button @clic ...
- docker-compose任务编排
一.docker-compose介绍 使用一个Dockerfile模板文件可以定义一个单独的应用容器,如果需要定义多个容器就需要服务编排.下面介绍Docker官方产品,Docker Compose. ...