font-size:字号大小


font-size属性用于设置字号,该属性的值可以使用相对长度单位,也可以使用绝对长度单位,其中,相对长度单位比较常用,推荐使用像素单位px,绝对长度单位使用较少。具体如下:

相对长度单位 说明
em 相当于当前对象内文本的字体尺寸
px 像素,最常用,推荐使用
绝对长度单位 说明
in 英寸
cm 厘米
mm 毫米
pt

font-family:字体


font-familay属性用于设置字体,网页中常用的字体有宋体、微软雅黑、黑体等,例如将网页中所有段落文本的字体设置为微软雅黑,可以使用如下CSS样式代码:

p{font-family:"微软雅黑"}

可以同时制定多个字体,中间以逗号隔开,表示如果浏览器不支持第一个字体,则会尝试下一个,知道找到合适的字体。

常用技巧:

1.现在网页中普遍使用14px+.
2.尽量使用偶数的数字字号,ie6以及以下的浏览器在设置奇数时,会有兼容性问题
3.各种字体之间必须使用英文状态下的逗号隔开。
4. 中文字体需要加英文状态下的引导,英文字体一般不需要加引导,当需要设置英文字体时,英文字体名必须位于中文字体名之前。
5.如果字体名中间包括空格、#、$等符号,则该字体必须加英文状态下的单引号或双引号,例如font-family:"Times New Roman";.
6. 尽量使用系统默认字体,保证在任何用户的浏览器中都能正确显示。

CSS Unicode : 字体


在CSS中设置字体名称,直接写中文是可以的。但是在文件编码(GB2312、UTF-8等)不匹配时会产生乱码的错误。xp系统不支持类似微软雅黑的中文。

方案一:我们可以使用英文来替代。比如font-family:"Microsoft Yahei".

方案二: 在CSS直接使用Unicode编码来写字体名称可以避免这些错误。使用Unicode写中文字体名称,浏览器可以正确的解析的。

font-family:"\SFAE\8F6F\9ED1",表示设置字体为“微软雅黑”。

字体名称 英文名称 Unicode 编码
宋体 SimSun \5B8B\4F53
新宋体 NSimSum \65B0\5B8B\4F53
黑体 SimHei \9ED1\4F53
微软雅黑 Microsoft YaHei \5FAE\8F6F\96C5\9ED1
楷体_GB2312 KaiTi_GB2312 \6977\4F53_GB2312\
隶书 LiSu \96B6\4E66\
幼圆 YouYuan \5E7C\5706
华文细黑 STXihei \534E\6587\7EC6\9ED1
细明体 MingLiU \7EC6\660E\4F53
新细明体 PMingLiU \65B0\7EC6\660E\4F53

我们以后写unicode字体,尽量只写宋体和微软雅黑:“\5B8B\4F53”,“\5FAE\8F6F\96C5\9ED1”

font-weight : 字体粗细


字体加粗除了用 b 和 strong 标签之外,可以使用css来实现,但是CSS是没有语义的。

font-weight属性用于定义字体的粗细,其可用属性:normal、bold、bolder、lighter、100—900(100的整数倍)。

小技巧:

数字400等价于normal,而700等价于bold,但是我们更喜欢用数字来表示。

CSS注释


html注释:<!-- -->

css注释:/* 需要注释的内容 */ 进行注释的

即在需要注释的内容前面使用 “ /* ”,在需要注释的内容后面使用“ */ ”

总结:html 注释和css注释非常提倡大家使用

font-style : 字体风格


字体倾斜除了用i和em标签之外,可用使用CSS来实现,但是CSS是没有语义的。

font-style属性用于定义字体风格,如设置斜体、倾斜或正常字体、其可用属性值如下:

normal:默认值,浏览器会显示标准的字体样式。

italic:浏览器会显示斜体的字体样式。

oblique:浏览器会显示倾斜的字体样式。

小技巧:

平时我们很少给文字加斜体,反而喜欢给斜体标签(em,i)改为普通模式。

font : 综合设置字体样式(重点)


font属性用于对字体样式进行综合设置,其基本语法格式如下:

选择器{font:font-style font-weight font-size/line-height font-family;}
使用font属性时,必须按上面语法格式中的顺序书写,不能更换顺序,各个属性以空格隔开。
​
注意:其中不需要设置的属性可以省略(取默认值),但必须保留font-size和font-family属性,否则font属性将不起作用。

开发者工具(chrome)

此工具是我们的必备工具,以后代码出了问题,我们首先第一反应就是:

“按F12”或者是“shift+Ctrl+l” 打开 开发者工具。

菜单:单击网页空白处———查看。

小技巧:

  1. ctrl+滚轮 可以放大开发者工具代码大小。

  2. 左边是HTML元素结构,右边是css样式

  3. 右边css样式可以改动数值和颜色查看更改后效果。

设置字体样式:字号大小,字体种类,字体粗细相关推荐

  1. html字体字号颜色怎么设置,html字体样式大全 html怎么改变字体大小和颜色

    网页字体样式华文黑体:STHeiti 网页字体样式华文楷体:STKaiti 网页字体样式华文宋体:STSong 网页字体样式华文仿宋:STFangsong 网页字体样式黑体:SimHei 网页字体样式 ...

  2. java中如何设置字体样式_如何在JAVA中设置字体样式和大小?

    我是新来的Java和无法弄清楚如何格式化我的代码是这样的: 字体"宋体"字体大小"9"大胆如何在JAVA中设置字体样式和大小? 我想整个段落的格式化文本.我真的 ...

  3. 一键批量修改PPT所有页面的字体样式、大小和颜色的方法

    问题背景 作为大学生的我们,在为每门课程的考试备考的时候,可能像我有这样的需求:打印所有老师上课讲解用到的PPT,这样可以在几天时间内临时抱佛脚通过考试.打印PPT的技巧就是一面纸张上打印2x3页PP ...

  4. Pycharm的相关配置:改字体样式和大小、更改图片背景、更改控制台输出的字体颜色

    文章目录 Pycharm的相关配置:改字体样式和大小.更改图片背景.更改控制台输出的字体颜色 一.pycharm更改字体样式和大小 二.pycharm更改图片背景 三.pycharm更改控制台输出的字 ...

  5. KDevelop修改字体样式和大小

    (1)设置 -> 配置KDevelop (2)Editor -> 字体和颜色 -> 字体 -> 修改字体样式和大小 -> ok

  6. html5 字体位置,html5字体样式 移动 html5 中文什么字体

    网页字体样式华文黑体:STHeiti 网页字体样式华文楷体:STKaiti 网页字体样式华文宋体:STSong 网页字体样式华文仿宋:STFangsong 网页字体样式黑体:SimHei 网页字体样式 ...

  7. oracle修改字体样式,电脑系统字体样式怎么改?电脑字体样式更改方法

    喜欢个性化电脑的朋友经常会想更改系统的一些默认设置,比如窗口动画.主题.或字体等等,总之要让我们看电脑时比较符合自己的口味才行哈,这里说明下如何更改系统显示的字体,包括图标下面的字体.右键菜单等等. ...

  8. java label设置字体颜色_Java中怎么设置JLabel的字体样式,大小,颜色

    展开全部 答 : 最常32313133353236313431303231363533e4b893e5b19e31333363386166见的解决方案有两种. 第一种: 原生的java写法. 核心代码 ...

  9. XWPFTableCell设置字体样式及大小导致的样式问题

    关于使用XWPFTableCell设置字体,搜遍了全网,看了很多文章,大致都是使用的XWPFRun去设置的字体,这个方法去设置字体本身是没有问题的,但是直接使用XWPFParagraph的create ...

  10. php如何导入字体样式,css怎么引入外部字体?css 字体样式设置的方法(实例)...

    在浏览器显示中,页面上不同的字体样式,不仅提升了页面的美观度,也提升了用户的浏览交互性.那么这些不同的字体样式是怎么用css设置的?本章就给大家带来css如何引入外部字体?css 字体样式设置的方法( ...

最新文章

  1. k8s-harbor安装
  2. Verilog功能模块——AXI4-Lite协议主机-单次写-使用FIFO
  3. boost::integer::gcd和boost::integer::lcm用法的测试程序
  4. FFMPEG结构体分析之AVPacket
  5. leetcode279. 完全平方数
  6. apache derby_Apache Derby数据库用户和权限
  7. 搭建TFS2008的过程及其注意事项
  8. 在CF卡上实现TrueFFS
  9. iphone 流媒体
  10. MongoDB数据库(二):增删查改
  11. Atiti. Php Laravel 5.1 环境搭建以及  error 排除
  12. MASM 32位汇编 32与16汇编区别
  13. CMOS、TTL门电路基础
  14. 2019CBA全明星周末举行正赛 南方明星队获胜
  15. ERROR! MySQL is not running, but PID file exists
  16. 一些名片上最常用的中英文称呼:
  17. Shell版本循环语句(if//for/while/case)
  18. 零输入响应,零状态响应,全响应
  19. WriteError Resulting document after update is larger than 16777216
  20. 位列首位!百度智能云开物入选“双跨”平台国家队

热门文章

  1. codeforces 1311D(暴力)
  2. 来了!Goby一年一度的红队专版正式发布!!
  3. 零基础能学好UI设计吗 相关学习规划是什么
  4. 国考省考行测:资料分析,两年复合增长率
  5. 17.Unity2D 横版 骨骼动画 之 动画中局部骨骼旋转+多层动画共同控制+局部骨骼索敌攻击
  6. 万法裨益,实战为王1
  7. STM32F407ZGT6通信协议学习
  8. 在BPM动态可配置表单中使用NoSQL技术可行性分析——通用流程化应用审批单设计思路(二)
  9. 从fishhook第三方库学到的知识
  10. 全面解析以太网交换机的作用与功能