dw一个css,可以多个页面共用么?多个页面共用,修改css一个页面,怎么才能让其他页面不会被修改

html-css017

dw一个css,可以多个页面共用么?多个页面共用,修改css一个页面,怎么才能让其他页面不会被修改,第1张

当然可以共用,而且理论上一个css文件可以供全世界的网站共用!只需要在调用的时候使用这个css文件的完整url即可。

你可以把多个页面的样式都写在同一个css文件中,其中可以包括公用的部分,也可以包括私有的部分,这样的话,只要修改公用的部分,则所有页面的对应的样式都会改变(比如设置 h1 {color:red} ,则所有页面的<h1>标签的颜色都是红色的);而修改私有的部分,则只影响对应的页面,其他页面不受影响(比如说页面1中有 <div id=x1></div>,其他页面没有,那么css中如果设置 #x1 {color:blue} 就只对页面1有效,其他页面没变化)。

在所有需要该公用css的html页面的<head></head>中的任意位置加入<link href="CSS文件的相对路径或绝对路径" rel="stylesheet" type="text/css" />,注意css的路径。

例如:

style.css 在 css文件夹里,html文件和css文件夹在同一目录下

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

在一个web程序中,我们往往希望页面中的一些最基本的样式是统一的,这样可以给人整齐划一的感觉,同时也可以省去很多重复冗余的css代码,下面是我经常用到的页面默认样式,也就是程序的每个页面都会首先载入这个样式,然后再依据其自身的特点载入自己特有的样式,可以参考一下

body{line-height:1.4background:#fff}

body,input,textarea,select{font-size:13pxcolor:#333font-family:arial}

body,h1,h3,h4,p,ul,ol{margin:0}

ul,ol{padding-left:0list-style-type:none}a img{border:0}

a:link,a:active,a:visited{color:#003text-decoration:none}

a:hover{color:bluetext-decoration:underline}

.biaoti1{height:25pxbackground:#e7e7e7}

.biaoti1 .tit{background:#3672aewidth:80pxheight:25pxtext-align:centerline-height:25pxcolor:#ffffont-size:14pxfont-weight:700}.biaoti1 .more{float:rightfont-size:12pxcolor:#06cfont-weight:700line-height:25pxmargin-right:5px}#clubsjihua_div_clubs .biaoti{width:389pxheight:246pxfloat:leftmargin-left:3pxborder-right:0 solid #ccc}

#clubsjihua_div_clubs .biaoti h1{font-size:14pxcolor:#c00height:30pxline-height:30pxborder-bottom:1px solid #cccwidth:95%}

#clubsjihua_div_clubs .biaoti h1 span{color:#cccfont-weight:400}

#clubsjihua_div_clubs .biaoti em{float:rightfont-style:normalfont-weight:400}

#clubsjihua_div_clubs .biaoti em a{font-size:12pxcolor:#005a98text-decoration:nonebackground:url(/images/arrow.jpg) no-repeatpadding-left:18px}#clubsjihua_div_clubs .biaoti em a:hover{color:redtext-decoration:underline}