2 css基础

1.1  CSS的概念

CSS的全称是层叠样式表(Cascading Style Sheets)，是一种用于描述网页样式和布局的计算机语言。

1.2  css的书写位置 样式表的创建方式

• 内部样式表

  • 在head里创建style标签

• 外部样式表

  • 创建css文件，然后做关联

  • 关联方式

    • 方式一：link

    • 方式二：style标签种写@import url(路径)

    • 区别：

      • 1.link属于html语法，@属于css语法

      • 2.link和html同时加载，@先加载html再加载css

      • 3.link没有兼容问题，@有兼容2.1才出的

      • 4.link的js是可控的，@js不可控

• 行内样式表

  • 在标签身上写style属性

1.3  css的语法 

选择器{声明} 声明就是样式语句 一个声明分为几个部分（2个部分） 冒号前面叫做属性名字，也就是样式名字 冒号后面叫做属性值，也就是样式值。

1.4  选择器

• 目标：为了找到标签

• 标签选择器==》直接写标签名字

• class类选择器

  • 先用class属性在标签上起个名字

  • 在css中使用的时候名字前面必须加点

  • 注意点

    • 1.如果多个标签的样式一致，公共用同一个名字

    • 2.一个标签允许起多个名字，空格隔开即可

• id选择器

  • 用的时候名字前面加#

  • 注意点

    • id名字具有唯一性，最好只出现一次

• 群组选择器

  • 一次性找多个标签，多个选择器之间逗号隔开

• 通配符选择器

  • *，可以找到所有的标签

  • 使用场景：一般是用来清除标签的间距

  • *{padding:0;margin:0;}

• 包含选择器

  • 后代：标志是一个空格，只要是后代都能找到，允许越级

  • 子代：标志是大于号，只能找儿子，不能越级查找

1.5  样式语句（声明） 

• 1.文字颜色：color

• 2.文字大小：font-size

• 3.加粗：font-weight：bold

• 4.倾斜：font-style:italic

• 5.背景颜色：background-color

• 6.宽度：width 高度：height

• 7.水平居中：text-align:center