CSS基础语法

1. CSS语法格式

语法格式由选择器和声明构成,其中选择器也叫选择符。这里的声明由键值对以属性:值的形式,多个声明之间使用分号分割。

选择器{
  声明1;
  声明2;
...
}

举一个例子:

h1{
  color:red;
  font-size:14px;
}

2. CSS高级语法

选择器分组:多个元素加入同一个样式

h1,h2,h3{
  color:red;
}

继承:当父元素声明了一些样式后,则父元素作为容器,其子元素也都继承了该特征样式。例如,在body中声明body{color:red},则正文中默认其他元素也有这个特征。除非在子元素中再次进行覆盖。

3. 确定选择器

3.1 CSS派生选择器

根据元素在其位置的上下关系来定义样式

ul li{
  color:red
}

3.2 Id选择符

  1. 定义Id选择符:可以直接使用如下格式:#id名{样式...}
  2. 使用: <html 标签 id="id名">...</html 标签>
  3. 注意: id选择符每个名字只能在页面中使用一次

3.3 CSS类选择符

class类选择符(使用点 . 将自定义名(类名)来定义的选择符)

  1. 定义: .类名{样式...}
  2. 使用: <html 标签 class="类名">...</html 标签>

类选择符可以在页面上重复使用

4. 选择符的优先生效顺序

[ID选择符] → [class选择符] → [html选择符] → [html属性]

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一语三年得 一吟泪两行 知音如不赏 归卧故山秋
    刘素素阅读 149评论 0 1
  • 时间悄然无声的来到2017最后一天了,其实大家最近都在做总结,我也在心里做了些许总结,趁着现在2018新年钟声还没...
    梦菲2010阅读 146评论 0 1
  • 今天大盘小幅低开之后开始震荡上行,但好景不长,不足半个小时就遭到空方反扑,一路快速下跌,直至十点半钟之后在金融股的...
    融河直播阅读 237评论 0 0
  • 拍摄地点 赤峰 通辽 作者 郝越 图片版权归本人所有,图片授权于简书用于设置为app开屏图,一切版权纠纷与简书无关
    HYphotographer阅读 258评论 0 0