前端入门part07css学习

css

• 写在head标签中；<style type="text/css"></style>

css的文字属性

• 规定文字样式的属性；font-style：italic; 斜体；写下fs按下tab键直接生成
• 规定文字粗细的属性；font-weight：bold; 加粗，取值分为单词和数字取值；比如bolder比bold还粗；lighter细线；写下fw+tab键
• 规定文字大小的属性；font-size
• 规定文字字体的属性；font-family；必须是用户已经安装的字体；
• 需求：如果设定的字体不存在，又不想使用默认字体怎么办？
• 比如本机电脑默认微软雅黑，可以在后面制定好备选方案。
  格式：font-family:"字体一","字体二"
• 如果想给英文和中文分别设置字体怎么办？
• 但凡是中文字体，里面都包含了英文；
• 但凡是英文字体，里面都没有包含中文
• 所以，font-family:"英文字体","中文字体" 可实现需求；前后要注意；
• 需求：当以上四种属性都需要设置时，如何简单快速设置？
• font:italic bold 10px "楷体" ；中间用空格隔开；①size和family不可以省略②size要写在family前面且所有属性最后；

在企业开发中，常见的字体有：

• 中文：宋体、黑体、微软雅黑；
• 英文：“Times New Roman”/Arial;
• 注意：名称是英文的也可能为中文字体；是不是中文字体要看能否处理中文；

文本装饰的属性

• 给加下划线: text-decoration: underline;
• 给加上删除线:text-decoration: line-through;
• 加上划线:text-decoration: overline;
• 去掉任何装饰:text-decoration: none; 比如超链接去掉下面那条线

文本水平对齐的属性

• 默认文本左对齐；text-align:center/right ;.

文本缩进的属性

• text-indent:2em ;缩进俩字符；一个em代表缩进一个字符宽度；

标签选择器

• 根据指定的标签名称，在当前界面找到所有该名称的标签，然后设置属性；
• 格式 标签名称{属性：属性值}
• 我们目前学过的所有标签都可以选择；

ID选择器

• 根据指定的ID名称找到相应的标签，然后设置相应的属性；
• 注意：ID选择器一定要在ID前面写上 #
• ID名称有一定规范性，只可以由字母数字下划线组成；不可以数字开头
• 在企业开发中，如果仅仅设置了样式，我们不会使用ID，因为ID是留给JS使用的

类选择器

• 根据指定的类名称选择对应标签，然后设置属性；
• 注意：类选择器一定要在前面加上.
• 与ID不同，ID是唯一的，但是类名可以重复
• 命名规范与ID命名相同；
• 类名就是专门给某个特定的标签设置样式的
• 一个标签啥的可以同时有多个类名比如<p class="para1 para2">

id	class
不可以重复	可以重复
一个HTML标签可以绑定一个ID	一个HTML标签可以绑定多个class名
#ID名	.class名
一般配合js使用	设置样式

后代选择器

• 用于指定标签的所有后代标签，设置属性；
• div p{属性：属性值} 先找到div的标签，再找div下面所有名称为p的标签，然后设置属性；
• 注意：①后代选择器必须用空格隔开；②后代不仅仅是儿子，也包含孙子和重孙子③后代选择器不仅仅可以使用标签，也可以使用ID名称，类名称等；

子元素选择器

• 在指定标签中所有特定的直接子元素，然后设置属性；标签名称1>标签名称2{}；要用>符号连接；
• 子元素选择器只会查找儿子，不会查找其他被嵌套的；