CSS(二)之 CSS和HTML结合的四种方式

一、style属性方式(行内样式)

利用标签中style属性来改变每个标签的显示样式。

例如:

<p style="background-color:#FF0000; color:#FFFFFF">

p标签段落内容。

</p>

该方式比较灵活,但是对于多个相同标签的同一样式定义比较麻烦,适合局部修改。

二、style标签方式(内嵌样式)

在head标签中加入style标签,对多个标签进行统一修改。

<head>

<style type="text/css">

            p {color:#FF0000;}

</style>

</head>

该方式可以对单个页面的样式进行统一设置,但对于局部不够灵活。

三、导入方式

前提是已经存在一个定义好的CSS文件。网页的一部分样式需要用到,那么就用到这种方式。

例如:

<style type="text/css">

@import url(css_3.css);

div {color:#FF0000;}

</style>

注:url括号后面必须要用分号结束。如果导入进来的样式与本页面定义的样式重复,以本页定义样式为准。

四、链接方式

通过head标签中link标签来实现,前提也是先要有一个已定好的CSS文件。

例如:

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

注:可以通过多个link标签链接进来多个CSS文件。重复样式以最后链接进来的CSS样式为准。

五、样式优先级

由上到下,由外到内,优先级由低到高。(就近原则)

六、代码规范

选择器名称{属性名:属性值; 属性名:属性值; ......}

属性与属性之间用 分号 隔开

属性与属性值直接用 冒号 连接

如果一个属性有多个值的话,那么多个值用 空格 隔开。

七、CSS中注释

只有一种:/*  */

 

 

 

 

 

 

 

 

 

 

 

 

 

猜你喜欢

转载自blog.csdn.net/ada_yangyang/article/details/81134932
今日推荐