网页设计.css样式

网页设计.css样式

一、CSS核心基础

1.1 CSS样式规则

• CSS样式中的选择器严格区分大小写，属性和值不区分大小写，一般全部小写。
• 如果属性的值有多个单词组成且中间包含有空格，则必须为这个属性的值加上引号（英）
• 如：p{font-family:"Times New Roman"}
• 为了提高代码的可读性，书写CSS时可以适当地加入一些注释
• /*这是CSS注释样式*/
• 在CSS中空格是不被解析的，花括号以及分号前后的空格可有可无。因此，可以用空格键、Tab、回车键等进行代码排版，如：
• P{text-decoration: underline; font-family: "微软黑雅"；}
• P{
text-decoration: underline; /*定义文字修饰*/
font-family: "微软黑雅"； /*定义字体类型*/
}
• 属性的值和单位之间不能有空格！

1.2 引入CSS样式表

使用CSS修饰网页元素时，首先需要引入CSS样式表，常用的引入方式有三种：行内式、内嵌式、链入式。

行内式：

内嵌式：

链入式：

1.3 CSS基础选择器

CSS基础选择器就是将CSS样式应用于特定的HTML元素。
大致分为基本的四种：标记选择器、类选择器、id选择器、通配符选择器。

标记选择器：

• 几乎所有的HTML标签都可以作为标记选择器
• 标记选择器最大的优点在于可以快速为同页面中的同类型标签标记统一样式，同样缺点就是不能设计差异化样式。
  
  

类选择器：

• 类选择器使用“.”进行标识，后面紧跟类名。
• 在该语法中，HTML元素的class属性值即为类名。
• 类选择器的最大优势在于可以为元素对象定义单独或相同的样式。
  

id选择器：

说明：
1.同一个id可以应用于多个标记，浏览器不会报错，但是这种方法不被允许
2.id选择器不支持像类选择器那样定义多个值，类似<p id=" bold font22">段落4：同时设置字号为22px、颜色、加粗效果</p>写法是错误的。

通配符选择器：