css读书笔记4:字体和文本
字体属性
网页中的字体有3个来源:
1.用户机器中安装的字体;
2.保存在第三方网站上的字体。可以使用link标签把它们链接到页面中;
3.保存在子集的web服务器上的字体。可以使用@font-face规则随网页一起发送给浏览器。
与字体样式相关的6个属性:
font-family(字体家族。一般对body元素使用,让整个网页使用同样的字体。一般需要多列出几种后备字体,以防前面的字体无效。)
font-size(字体大小。)
font-style(字体样式。设定字体是斜体还是整正体。)
font-weight(字体粗细。该属性有2个值:bold粗体,normal普通。)
font(简写属性。可以直接设置以上所有的属性,但分顺序,最好分开用,免得搞错。)
文本属性
与文本有关的几个css属性:
text-indent(文本缩进)
letter-spacing(字符间距)
word-spacing(单词间距。因为汉字不用空格分隔,所以这个属性对纯中文网页没有什么用。)
text-decoration(文本装饰。属性的值有:underline下划线,overline上划线,line-through删除线,none没有装饰。)
text-align(文本对齐。属性的值有:left左对齐,right右对齐,center居中对齐,justify两端对齐。)
line-height(行高。可以使用倍数或者绝对像素值。)
text-transform(文本转换。属性的值有:none默认,uppercase转成大写,lowercase转成小写,capitalize每个单词首字母大写。)
vertical-align(垂直对齐。这个属性只对行内元素起作用,一般用来展示上下角标。)
css读书笔记4:字体和文本的更多相关文章
- 【精通css读书笔记】 第八章 布局
学习了css布局的基础后又来翻阅<精通css>这本经典书籍,对布局有了进一步的认识. 基于浮动的布局 两列的布局仍然是使用一个元素向左浮动,一个元素向右浮动,值得注意的是要加入displa ...
- css读书笔记3:定位元素
定位元素要掌握css技术,核心就是要掌握元素定位. 一般把下面这条规则作为所有css样式表的第一条,初始化所有元素的内边距和外边距都为0: * {padding:0;margin:0;} 盒模型浏览器 ...
- css读书笔记2:css工作原理
css就是一种先选择html元素,然后设定选中元素css属性的机制.css选择符合要应用的样式构成一条css规则. 为文档添加样式的3种方法: 1.行内样式,直接写在特定标签的style属性中:2.嵌 ...
- css读书笔记1:HTML标记和文档结构
块级元素和行内元素:块级元素:上下堆叠,每个块级元素都独立占一行.块级元素的盒子宽度与父元素同宽.行内元素:左右堆叠,只有在空间不足的情况下才会折到下一行显示.行内元素的盒子会收缩包裹其内容,并尽可能 ...
- 超越css读书笔记
一.运用所有有效的css选择符 1.属性选择符(基于一个元素是否有属性名称,例如href,或者属性值) 例如:img[alt]{border:1px;} 所有包含alt属性的图像都将会有一个灰色的边框 ...
- 【CSS学习笔记】字体的控制
关于font-family: "无衬线体"(Sans-serif),比如黑体,微软雅黑 "有衬线体"(Serif),比如宋体,新宋 程序员设置的字体,客户电脑上 ...
- CSS读书笔记(3)---清除浮动的几种方法
浮动元素容易造成页面错位现象.下面说说关于清除浮动的几种方法. 首先.先创建一个浮动导致错位的页面. <!DOCTYPE html> <html lang="en" ...
- CSS读书笔记(2)---简易相册和日历表的制作
一.HTML和CSS制作的简易相册 相册在默认情况下是缩略图显示,而且是截取相片的某一部分显示的.当鼠标停留在某张缩略图上,相册列表中的缩略图变为大图,展示在相册的左边区域, 同时缩略图部分变成空的 ...
- CSS读书笔记(1)---选择器和两列布局
(1)CSS选择器优先权选择. 优先权从大到小的选择如下: 标有!important关键字声明的属性 HTML中的CSS样式属性 <div style="color:red" ...
随机推荐
- Duilib动画按钮实现(转载)
转载:http://blog.csdn.net/cuiguanghui123/article/details/51674218 .h文件 #ifndef __UIBUTTONEX_H__ #defin ...
- 一、java环境搭建
结论: 1.jdk包括jre,jre包括jvm. 2.eclipse ide依赖环境变量.如果未设置,在启动eclipse工具会提示:返回码是13.
- GMM及EM算法
GMM及EM算法 标签(空格分隔): 机器学习 前言: EM(Exception Maximizition) -- 期望最大化算法,用于含有隐变量的概率模型参数的极大似然估计: GMM(Gaussia ...
- CANopen笔记1
CAN现场总线只定义了OSI网络模型的第一层(物理层) 和第二层(数据链路层) ,而这两层一般已被CAN硬件完全实现了.由于没有规定应用层,本身并不完整,需要一个高层协议来定义CAN报文中的11/29 ...
- Creating Dynamic LOV in Oracle D2k Forms
Dynamic Lov is a good idea for the form where too many Lov requirement is there with different recor ...
- How To Tune or Test PLSQL Code Performance in Oracle D2k Forms
You can test or tune your program unit performance in Oracle forms with Ora_Prof package.Suppose you ...
- [SAP ABAP开发技术总结]以二进制、字符模式下载文件
声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...
- hdu 4946 Just a Joke(数学+物理)
链接:http://acm.hdu.edu.cn/showproblem.php?pid=4969 Just a Joke Time Limit: 2000/1000 MS (Java/Others) ...
- Spark Streaming官方文档学习--上
官方文档地址:http://spark.apache.org/docs/latest/streaming-programming-guide.html Spark Streaming是spark ap ...
- C# int.Parse()与int.TryParse()
int i = -1;bool b = int.TryParse(null, out i);执行完毕后,b等于false,i等于0,而不是等于-1,切记. int i = -1;bool b = in ...