css

 

1、css简介

CSS 指层叠样式表 (Cascading Style Sheets)。主要用来设置网页中元素的样式。如边框，颜色，位置等…

 

CSS即可以现在HTML中，也可以写在元素的style属性里面，还可以写在.css外部文件里然后引入到页面

 

 

2、基本语法

 

• 语法非常简单。

写在外部文件或者html头标签里的时候。

选择器 {

样式名：样式值;

样式名：样式值;

…………

}

 

写在元素的style属性里面的时候。“样式名：样式值；样式名：样式值；……”

<p style=”color:red;font-size:16px;”>你好呀！</p>

 

• 编写位置

内部

标签的style属性中:

<p style="color: red ; font-size: 12px">落霞与孤鹜齐飞</p>

 

写到html头的style标签中:

<style type="text/css">

p {

color: blue;

background-color: yellow;

}

</style>

 

外部

写在外部的css文件中，然后通过link标签引入外部的css文件:

<link rel="stylesheet" type="text/css" href="style.css" />

 

3、选择器

• 标签选择器
  1. 按照标签名选中相应的元素。

p {

color:red;

}

• Id选择器
  1. 按照元素的id选中相应的元素，使用#id值

<p id=”abc”>大家好</p>

#abc {

color:red;

}

• 类选择器
  1. 按照元素的类名选中相应的元素，使用.class值

<p class=”foot”>你好</p>

<b class=”foot”>你也好</b>

.foot {

color:red;

}

 

• 组选择器

可以同时使用多个选择器选中一组元素，使用，分隔不同的选择器

选择器1，选择器2，……，选择器N{

color：red；

}

 

4、常用样式

4.1颜色

color：red；

颜色可以写颜色名如：black, blue, red, green, white, yellow等

颜色也可以写rgb值和十六进制表示值：如rgb(255,0,0)，#00F6DE，如果写十六进制值必须加#

4.2 宽度

width:19px;

宽度可以写像素值：19px；

也可以写百分比值：20%；

4.3、高度

height:20px;

同宽度一样

4.4、背景颜色

background-color:#0F2D4C