HTML学习笔记8 css初见-文本属性

写在前面

特此声明，本系列学习笔记内容来源于网络，为加深记忆所做的笔记，内容相当于转载自他处，转载来源为 极客江南的博客

引入CSS原因

• 直接通过HTML的标签来修改样式不符合HTML只用来添加语义的初衷
• 直接通过HTML的标签来修改样式会使需求变更时修改的代码量大大增加

• 通过HTML的标签来修改样式还需要记忆标签有哪些属性

• css的引入则完美解决了这个问题，css用作修改样式，与HTML用作添加语义结合，实现了功能的分解。

格式

<style type="text/css">
    标签名称{
        属性名称：属性值;
        ...
    }
</style>

注意点：

• style标签必须写在head的开始个结束标签之间
• style中的type其实可以不用谢，因为他的默认值就是“text/css”
• 设置样式时必须按照固定格式来写， key:value;

css中常见文字样式属性

• 文字样式属性：

font-style:normal;
<!--
normal：正常的，默认取值
italic:倾斜的
-->

• 文字粗细属性：

font-weight:bold;
<!--
100-900（取整百）          数值取值的范围
bold/bolder/lighter   单词取值
-->

• 文字大小属性：

font-size:30px;
<!--
必须带单位px
-->

• 文字字体属性：

font-family:"微软雅黑";
<!--
1、若取值为中文需要将字体用双引号或者单引号（这里都是指英文字体下的引号）引起来
2、设置的字体必须是电脑上已安装字体
-->

注：若设置的字体不存在，会默认使用宋体；
若字体不存在有不想用默认的字体显示，可以设置备选方案：font-family:"微软雅黑","备选字体";

注2：如果要分别一段文字中的英文字和汉字的格式，可通过设置备选方案来实现，如font-family:"Franklin Gothic Heavy"，"微软雅黑";，但需注意要将英文字体写在前面，这样在英文字体里找不到中文格式时就会调用中文字体。小注：英文放在前面的原因是英文字体中不包含中文，但中文字体中包含英文

注三：企业开发中常用字体：中文：宋体、黑体、微软雅黑 英文： Times New Roman/Arial

• 文字样式简写方式：

font:bold italic 30px "楷体"

注：这种缩写格式可以省略style和weight，不能省略size和family，且size与family顺序不能变，并位于最末两个位置。但有style和weight的话，style和weight的位置可交换

• 文本装饰的属性：

text-decoration:none;
<!--
underline（下划线）、
line-through（删除线）、
overline（上划线）、
none(常见作用是清楚超链接的下划线)
 -->

• 文本对齐的属性

text-align：right；
<!--取值：left right center -->

• 文本缩进的属性

text-indent:2em;
<!--控制缩进，单位为em表示缩进几个字-->

css中注释样式

/*  content   */