内部样式解决了内联样式的问题,但他也有弊端,主要表现在一下两个方面:
弊端1,内部样式只能作用于一个页面,如果要实现多个页面共享一个样式,就做不到了。
弊端2,随着样式代码的不断增加,在编辑器中,要不停的上下滚动屏幕来编辑样式,很不方便。
解决这些弊端的方法就是使用外部 CSS。
外部 CSS,也叫外部样式,可以通过改变一个文件来改变整个网站的外观!
我们来做个例子。
在 002-add-css 文件夹里创建一个 mystyle.css 文件,在这个文件里直接编写样式:
body {
background-color: lightblue;
}
h1 {
margin-left: 20px;
}
前面说到,样式表代码的编写格式很宽松,但是我们编写样式的时候还是要有一定的规范:
选择器和花括号中间用一个空格隔开;
每一条样式声明语句单独一行定义;
两组样式定义用空行来分隔。
预览页面,第一个页面的样式添加好了。
预览页面,第二个页面的样式也添加好了。
不难发现,在 mystyle.css 定义的一套样式,应用到了两个页面上,做到了多个页面的样式共享。
文章配套视频链接:
如发现本站有涉嫌抄袭侵权/违法违规等内容,请联系我们举报!一经查实,本站将立刻删除。