字体类样式我们已经学习过字号font-size、字体font-family两个属性,接下来还有几个常用的字体属性。

粗细 font-weight:

作用:设置文字是否加粗显示。

属性名:font-weight,属于 font 属性的一个单一属性。

属性值有两种方式:单词类型、数字类型。

单词类型:

 数字类型:

100-900 之间的整百数字。

数字越大,文字显示越粗。

其中 400 等价于 normal,700 等价于 bold。

字体风格 font-style:

作用:设置文字是否斜体显示。

属性名:font-style,属于 font 属性的一个单一属性。

属性值: 单词。

属性值:

实际应用中,更多的斜体效果习惯使用italic属性值。

行高 line-height:

作用:设置的是一行文字实际占有的高度,文字字号在行高中是垂直居中的。

属性名:line-height,属于 font 属性的一个单一属性。

属性值:

实际应用中,行高的数值通过设计图获取,量取数值时需要使用一些辅助软件工具。

Fireworks软件:

Fireworks软件初始设置:选中文字工具,在属性栏中将平滑消除锯齿, 更改为不消除锯齿,方便文字的像素点清晰显示。

 量取行高的步骤:

第一步:确定文字字号和字体。使用文字工具,书写两个与内容相同的文字,调整 字号和字体,直到两个文字都完全重合,就是我们需要的字号和字体。制作时,设置一个与内容文字颜色差异较大的字体颜色。

第二步:根据已知的字号和字体,再书写上下对齐的两行文字,调整属性面板的行 高值单位为像素,更改数值大小,直到两行文字都对齐,得到的就是我们需要的行高值。

字体综合 font:

字体、字号、行高、加粗、斜体都是font综合属性的单一属性。 font属性五个单一属性的值可以进行合写,属性值可以有2到多个,值之间用空格进 行分隔。

写法1:font进行综合书写时,必须有字号和字体参与,而且必须字号在前,字体在后,不能 颠倒顺序。

写法2: font属性经常对字体、字号、行高进行合写,书写顺序必须是字号、行高、字体,字号和行高之间必须用/进行分隔。

写法3:如果font属性需要设置加粗和斜体,两个属性值只能写在最前面,两个值之间可以互换位置。后面的字号、行高、字体不能更改位置。

CSS 常用样式-字体属性的更多相关文章

  1. CSS 常用样式 – 背景属性

    一.背景颜色 background-color 属性名:background-color 作用:在盒子区域添加背景颜色的修饰 加载区域:在 border 及以内加载背景颜色 属性值:颜色名.颜色值 & ...

  2. CSS常用样式属性

    1.CSS字体和文本相关属性 属性 font-family 规定文本的字体系列,比如:“serif” ''sans-serif" font-size 规定文本的字体尺寸 font-style ...

  3. css常用样式font控制字体的多种变换

    CSS 字体属性定义文本的字体系列.大小.加粗.风格(如斜体)和变形(如小型大写字母)font-family控制字体,由于各个电脑系统安装的字体不尽相同,但是基本装有黑体.宋体与微软雅黑这三款字体,通 ...

  4. CSS常用样式及示例

    CSS常用样式及示例 一.简介      层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集) ...

  5. CSS常用样式(四)之animation

    上篇CSS常用样式(三)这篇博文中已经介绍过了CSS中具有动画效果的transition.transform,今天来大概说说CSS中的animation.animation的加入会使得动画效果更加乐观 ...

  6. 复习-css常用伪类别属性

    css常用伪类别属性 对<a>标签可制动态效果的css a:link:超链接的普通样式 a:visited:被点击过的超链接样式 a:hover:鼠标指针经过超链接上时的样式 a:acti ...

  7. 复习-css控制文本字体属性

    css控制文本字体属性 font-family:字体系列,如”serif“”sans-serif“ font-size:尺寸 font-style:字体样式,如“normal,italic(斜体).o ...

  8. css常用样式对文本的处理演练

    CSS文本属性可定义文本的外观,这是毫无疑问的,其次css可以通过以下属性改变文字的排版,比方说letter-spacing实现字符间距text-indent: 2em;完成首行缩进2字符word-s ...

  9. 从零开始学习前端开发 — 9、标签嵌套规则及CSS常用样式覆盖

    1. 块级元素可以包含内联元素或某些块级元素,但内联元素却不能包含块级元素,它只能包含其它的内联元素: <div><h1></h1><p></p& ...

  10. css常用样式属性详细介绍

    对于初学css的来说,肯定会觉得这么多样式不好记,而且记住了也容易忘,其实刚开始我们不用去记这么多的样式,确实是记了也会忘,刚开始只需记住一些常用的就可以了,然后在慢慢的使用过程当中接触并学习一些高级 ...

随机推荐

  1. 从零搭建hadoop集群之安装jdk

    卸载系统自带的OpenJDK以及相关的java文件 1. 查询系统自带的OpenJDK版本信息 [root@hadoop01 ~]# java -version #查询系统自带的OpenJDK版本信息 ...

  2. corkscrew在ssh中发生错误

    使用绝对路径 ProxyCommand="corkscrew 127.0.0.1 12345 jump.123.com 2020" abc@efg.com 改为 ProxyComm ...

  3. kafka监控系统kafka eagle安装和使用

    一.kafka eagle介绍 kafka eagle 是一款由国内公司开源的Kafka集群监控系统,可以用来监视kafka集群的broker状态.Topic信息.IO.内存.consumer线程.偏 ...

  4. ISTQB软件测试初级认证模拟题

    参考地址 http://www.docin.com/p-297467364.html 第一章:软件测试基础(18%) 1.学习目标 1.1 为什么需要软件测试? (K2) ① 通过具体的例子,来描述软 ...

  5. CGAL求最小外包矩形

    有两种所谓的最小外包矩形,第一种通过求所有节点的最小与最大xy来求的,这种叫与坐标轴平行的最小外包矩形:另外一种则是本文说的这种,与范围的形状与走势有关的,叫非坐标轴平行的最小外包矩形,效果如下图所示 ...

  6. 记一个好用的轮播图的FlexSlider

    之前给自己公司的主页套用过一个js动态生成的轮播图,但是从载入的时机和载入后的效果都不太理想,又懒得去优化了,这次偶然遇到一个比较不错的轮播图的js插件,记录之. 首先它是给予jquery的,引进jq ...

  7. Django——全局配置settings详解

    Django设置文件包含你所有的Django安装配置.这个文件一般在你的项目文件夹里.比如我们创建了一个名为mysite的项目,那么这个配置文件setting.py就在项目里的mysite文件夹里. ...

  8. Vue的hash/history模式

    hash路由模式 URL 中的 hash 值只是客户端的一种状态,向服务端发送请求的时候,hash 部分不会被发送: hash 值得改变会在浏览器的历史记增加访问记录,所以可以通过浏览器的回退.前进控 ...

  9. 运用python中装饰器方法来解决工作中为原有代码添加功能问题

          Python  装饰器 在实际的工作中,经常碰到领导或产品经理会提出很多甚至(变态)的产品要求,作为python开发,好不容易完成领导的需求,做出一个产品,并且经过测试成功上线.突然有一天 ...

  10. .Net Standard .Net Framework .Net Core 版本对应