正如咱们在上一章中解说的那样,HTML元素使页面规划者能够对文档的构造进行符号。HTML标准列出了浏览器应该怎么显现这些元素的攻略。例如,您能够合理地保证强元素的内容将显现粗体。此外,您能够非常信赖大多数浏览器将运用大字体巨细显现H1元素的内容…最少大于P元素,大于H2元素。可是除了信赖和期望之外,你没有任何操控你的文字呈现。
CSS改变。CSS把规划师放在驾驶座上。咱们致力于本书的其余有些解说你能够用CSS做什么。在本章中,咱们将向您介绍怎么编写款式表的基本知识以及CSS和HTML怎么一起描绘文档的构造和外观。
规矩和款式表
要开端运用CSS,你乃至不用写款式表。第16章将告诉您怎么指向Web上现有的款式表。
有两种办法创立我国。您能够运用一个一般的文本修改器和“款式表”手艺编写,也能够运用专用工具例如页面规划应用程序,它支撑CSS。专用工具答应您在不学习CSS语言语法的情况下创立款式表。可是,在很多情况下,规划师将要修正款式表的手以后,咱们引荐你学习的手艺编写和修改系统。那咱们就开端吧。
H1 {色彩:绿色}
上面看到的是一个简略的CSS规矩,包含一条规矩。规矩是对于一个或多个元素的一个文体方面的句子。款式表是应用于HTML文档的一组或多个规矩集。上面的规矩设置一切榜首级标题的色彩(H1)。让咱们来看看规矩的可视成果是什么:
图2.1
[图像]
咱们如今开端解剖规矩。
规矩的解剖
规矩由两有些构成:
挑选器-左曲括号前有些
声明-卷括号内的有些
[图像]
挑选器是HTML文档和款式之间的连接。它指定了哪些元素受声明的影响。该声明是该规矩的一有些,论述了影响将。在上面的比如中,挑选器是H1,声明是“色彩:绿色”。因而,一切H1元素都会遭到声明的影响,也就是说,它们将变成绿色。(色彩特色只是影响远景文本色彩,还有别的特色的布景,边框等)
上面的挑选器是根据元素的类型:它挑选一切类型的元素“H1”这种挑选器被称为类型挑选器。任何HTML元素类型都能够用作类型挑选器。类型挑选器是最简略的挑选器。咱们将在CSS挑选器中评论别的类型的挑选器。,“CSS挑选器。”
誓言的解剖
声明由冒号分隔成两有些:
特色-冒号之前的那一有些
值-冒号后的那一有些
[图像]
产业是某物所具有的品质或特性。在前面的比如中,它是色彩。CSS2(拜见独自的盒子)界说了大概120功能,咱们能够将值分配给一切的人。
CSS标准
层叠款式表是由W3C两种标准描绘:CSS1和CSS2。CSS1于1996十二月发行,描绘了一个简略的格式化模型大多是根据屏幕的演示。CSS1大概有50的特色(如色彩和字体巨细)。CSS2于1998五月完结,建立在CSS1。CSS2包含一切CSS1功能和增加自个的70,如特色来描绘听觉演示和分页符。在这本书中,咱们不要企图差异CSS1和CSS2和运用术语“CSS”之间的差异很重要,除非。最具特色的前四章中描绘了有些CSS1。假如你想阅览CSS标准自身,你能够找到他们:

该值是该特色的准确标准。在这个比如中,它是“绿色”,但它能够很简单地是蓝色,赤色,黄色,或别的一些色彩。
下图显现了规矩的一切成分。卷括号({)和冒号(:)使浏览器能够差异挑选器、特色和值。
图2.2规矩图。
[图像]
分组挑选器和规矩
在规划CSS时,简练是一个方针。咱们以为,假如咱们能够减少款式表的巨细,咱们能够让规划人员编写和修改款式表“手”。CSS因而包含几种机制,经过分组挑选器和声明来缩短款式表。
例如,考虑这三条规矩:
字体分量:粗体
H2 {字体分量:粗体}
H3字体分量:粗体}

一切这三个规矩有完全一样的声明-他们设置字体是斗胆的。(这是运用字体权重特色,咱们在字体中评论。由于一切三个声明是一样的,咱们能够将挑选器组合成一个逗号分隔的列表,只列出一次声明,像这么:
H1,H2,H3 {字体款式:粗体}
此规矩将发生与前三个一样的成果。
挑选器可能有多个声明。例如,咱们能够用这两个规矩编写款式表:
H1 {色彩:绿色}

H1文本对齐:基地}
在这种情况下,咱们都企图要绿色、要以帆布。(这是运用文本对齐特色,在第5章评论。)
可是咱们能够经过将同一挑选器有关的声明分组到分号分隔的列表中来完结相同的作用,例如:
h1 {
色彩:绿色;
文本对齐:基地;
}
一切声明有必要包含在一对大括号内。分号分隔声明,但可能不需求也会呈如今最终声明的结束。此外,为了使您的代码更简单阅览,咱们建议您把每个声明自个的行,由于咱们在这里。(浏览器不会在乎,他们会忽略一切剩余的空格和换行符。)
如今你已经把握了怎么创立CSS规矩和款式表的基础知识。可是,你还没有完结。为了使款式表有任何作用,您有必要将款式表“粘贴”到HTML文档中。

html字体问题的更多相关文章

  1. 谈谈一些有趣的CSS题目(十二)-- 你该知道的字体 font-family

    开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...

  2. Linux 桌面系统字体配置要略

    字体显示效果测试 这一段是为了测试宋体字的显示效果,包括宋体里面自带的英文字体,“This is english,how does it look like?”.这一行是小字.后面几个字是加粗的宋体. ...

  3. 在 Ubuntu 14.10 中借用 Windows 的字体

    在前一篇随笔中,我详细讨论了字体的分类及用途,也以 Fedora 20 为例,展示了字体配置的思路和方法.我在配置 Fedora 20 系统字体的时候,采用的是一种釜底抽薪的方法,完全抛开了系统原有的 ...

  4. TODO:一不顺眼就换字体Go之代码篇

    TODO:一不顺眼就换字体Go之代码篇 image包实现了一个基本的2D图像库,该包中包含基本的接口叫做image,这个里面包含color,这个将在image/color中描述:新增字体font,进行 ...

  5. TODO:一不顺眼就换字体Go之应用篇

    TODO:一不顺眼就换字体Go之应用篇 字体,文字的外在形式特征.就是文字的风格,是文字的外衣.好的字体让人看得舒服,让人更有看.写的欲望哦.2016-11-16 GO官方博客发布了同名Go字体,并没 ...

  6. TODO:Go语言同名Go字体发布

    TODO:Go语言同名Go字体发布 2016-11-16 Go语言官方博客发布了一款同名字体–Go字体.此字体族包括正常.粗体和斜体渲染,支持比例和等宽字体.此字体已经经过用于编程方面的技术测试,使用 ...

  7. Android SearchView 自定义SearchIcon和字体颜色大小

    自定义SearchView的搜索图标和字体属性相对复杂一些,记下来. 一.自定义SearchIcon 1.API版本低于21:版本小于21时,要修改SearchIcon比较复杂,需要先获取到Searc ...

  8. Win10 字体模糊解决(DPI缩放禁用),设置默认输入法英文

    电脑坏了 , 换了新电脑, 但是新电脑,死活不能装win7, 装都不能装!!!郁闷了 好多地方字体模糊了,百般设置都不好看, 后来远程桌面到win2008server, 发现,在远程桌面里面居然很清晰 ...

  9. Mardown字体颜色、背景色

    Markdown字体颜色.背景色 字体颜色表 Markdwon测试 **粗体文字**,或__加文字__ 加粗 Markdown测试 *斜体文字*, 或_斜体_ 斜体 Markdwon测试 列表: 背景 ...

  10. 初学者--bootstrap(六)组件中的字体图标----在路上(9)

    组件---字体图标 无数可复用的组件,包括字体图标.下拉菜单.导航.警告框.弹出框等更多功能. 1.如何使用:        出于性能的考虑,所有图标都需要一个基类和对应每个图标的类.把下面的代码放在 ...

随机推荐

  1. 唐伯猫的 sql server 2008 的安装和操作记录

    在服务器win 2008 server r2 上安装sql 首先下载sql  server 2008  ,云盘有存储sql,很多论坛也有下载SQLEXPRADV_x64_CHS.exe 双击sql s ...

  2. PPAPI VS NPAPI

    flash player PPAPI 它的CPU和内存占用率会比较高,主要是因为缓存大多放在内存里而不是硬盘上.   npapi的flash跟ppapi的flash基本是一样的,只不过ppapi插件都 ...

  3. SEO-发信息注意的问题

    SEO是什么? SEO的全称是Search Engine Optimization,翻译过来就是搜索引擎优化,说到搜索引擎,可能不是特别的清楚.通俗点讲,就是百度,谷歌,雅虎,这些可以直接搜索到你想要 ...

  4. C#传递委托给C或C++库报错__对XXX类型的已垃圾回收委托进行了回调

    出现的原因: 因为你传给C或C++的委托是局部的.可能传过去之后就被垃圾回收了,再次调用就会异常. 想办法做成全局的就好 public void Play(string url) { _bassStr ...

  5. iOS开发之UINavigationController

    1.概述: 利用UINavigationController,可以轻松地管理多个控制器,轻松完成控制器之间的切换,典型例子就是系统自带的“设置”应用. 2.UINavigationController ...

  6. 利用firefox调试安卓手机端web

    分2部分: 手机: 1.安装最新版firefox 2.打开浏览器,输入about:config 3.设置 devtools.debugger.remote-enabled 值为true devtool ...

  7. 百度api的使用

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  8. 怎样获得PRINCE2证书?报名PRINCE2有什么条件?

    参加培训:想要获得PRINCE2资格证书,参加培训是非常必要的,正规的培训机构有获得组织认证考试的权力.光环国际全年开设prince2课程班,全国各个地区均可以选择培训及考试 选择培训机构:只有经AP ...

  9. redis实现队列消息的ack

    由于公司提供的队列实在太过于蛋疼而且还限制不能使用其他队列,但为了保证数据安全性需要一个可以有ack功能的队列. 原生的redis中通过L/R PUSH/POP方式来实现队列的功能,这个当然是没办法满 ...

  10. js数组的几个练习题

    第一次在博客园写文章,之前一直自己做记录.现在前端工作两年了,对前端整体技术有较清晰的了解.项目用了vue,react之类的写,如今打算从基础开始,慢慢深入了解原生的JS.这几天清明节,玩的嗨皮,最后 ...