• CSS简介
  • CSS根底选择器
  • CSS字体属性
  • CSS文本属性
  • CSS的引入形式

CSS简介

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

作用：

  • 用于HTML文档中元素的款式定义
  • 实现内容（html元素）与体现（css款式）的拆散
  • 实现代码的可重用性和可维护性

CSS次要局部：选择器及一条或多条申明。

  • 选择器用于指定CSS款式的HTML标签，花括号内是对该对象设置的的具体款式。
  • 属性和属性值以“键值对”的模式呈现。
  • 属性是对制订对象设置的款式属性，例如字体大小、文本色彩等。
  • 属性和属性之间用英文“:”离开。
  • 多个键值对之间用英文“;”进行辨别。

CSS根底选择器

CSS选择器作用：抉择标签

  • 标签选择器

用HTML标签名作为选择器，按标签名分类，为页面中的某一类标签指定对立的CSS款式。

  • 类选择器

为了差异化抉择不同的标签，独自选一个或某几个标签，能够应用类选择器。

  • id选择器

款式#定义，构造id调用，只能用一次，他人勿应用
款式点调用，构造类（class）调用，一个或多个，开发最罕用

  • 通配符选择器

应用“*”定义，示意选中所有元素（标签）。

CSS字体属性

（1）罕用字体属性

（2）font复合属性

能够把以上文字款式综合来写，节约代码。

格局：

font: font-style font-weight font-size/line-height font-family;

比方：

body{    font: normal 400 25px 'Microsoft yahei'; }
  • 应用font属性时，必须按下面语法格局中的程序写，不能更换程序，各个属性间以空格隔开。
  • 不须要设置的属性能够省略，但必须保留font-size和font-family属性，否则font属性将不起作用。

CSS文本属性

CSS的引入形式

（1）行内样式表（行内式）

在标签外部写个style属性，适宜批改简略的款式。

（2）外部样式表（嵌入式）

将所有的CSS代码抽取进去，独自放到一个<style></style>标签中。

<style>    div {        color: red;        font-size: 12px;    }</style>

<style></style>标签个别放在<head></head>标签里。

（3）内部样式表（链接式）

开发过程中，应用的最多的形式。

先独自写一个CSS款式文件，而后在HTML页面通过<link>标签援用

<link rel="stylesheet" href="css文件门路">