CSS——入门

CSS——入门

导读

目录

CSS——入门

导读

1.CSS简介

HTML的局限性

CSS—网页的美容师

CSS语法规范

CSS代码风格

样式格式书写

样式大小写

空格规范

---

 

1.CSS简介

HTML的局限性

HTML仅保持结构的完整性，即只关注内容的语义，可以做简单的样式，但是非常臃肿和繁琐

 

CSS—网页的美容师

CSS是叠层样式表（Cascading Style Sheets）的简称

有时会称作CSS样式表或级联样式表

CSS是一种标记语言，主要用于设置HTML中的文本内容（字体、大小、对齐方式等）、图片的外形（宽高、边框样式、边距等）以及版面布局和外观显示样式

CSS可以美化HTML、让HTML更漂亮，布局更简单

总结

1.HTML主要做结构，显示元素内容

2.CSS美化HTML，布局网页

3.CSS最大价值：由HTML专注去做结构呈现，样式交给CSS，即结构（HTML）与样式（CSS）相分离

 

CSS语法规范

CSS规则由两个主要部分构成:选择器以及一条或多条声明

• 选择器是用于指定CSS样式的HTML标签,花括号内是对该对象设置的具体样式
• 属性和属性值以"键值对"的形式出现
• 属性是对指定的对象设置的样式属性,例如字体大小\文本颜色等
• 属性和属性值之间用英文";"分开
• 多个"键值对"之间用英文";"进行区分

 

CSS代码风格

以下代码书写风格不是强制规范,而是符合实际开发书写方式

样式格式书写

①紧凑格式

h3{ color: deeppink;font-size: 20px;}

②展开格式

h3  {

     color: pink;

      font-size: 20px;

  }

推荐第二种格式,更直观

 

样式大小写

h3 {

    color: pink;

  }

H3 {

    COLOR: PINK;

  }

推荐样式选择器,属性值,属性值关键字全部使用小写字母,特殊情况除外

 

空格规范

h3 {

    color: pink;

  }

①属性值前面,冒号后面,保留一个空格

②选择器(标签)和大括号中间保留空格

 

(本文是根据b站黑马程序员pink老师做的笔记)