css多种书写格式
行内样式
代码直接写在标签内部
<!--书写css第一种方式,行内样式-->
<div style="color: red">css第一种书写格式</div>
内联样式
在head标签之间加上一对style标签,在其中编写css代码
<style>
/*书写css代码的第二中方式,内联样式*/
div:nth-child(2) {
color: skyblue;
}
</style>
外链样式
可以单独新建一个.css文件,将css代码写在其中,然后通过link标签将.css文件和.html文件链接起来,写在head标签之间。
<!--书写css代码的第三中方式,外链样式-->
<link rel="stylesheet" href="193-css书写格式.css">
导入样式
可以单独新建一个.css文件,将css代码写在其中,然后在style标签中,使用import导入样式
<style>
/*书写css代码的第四种方式,导入样式。需要写在style开头 */
@import "193-css书写格式.css";
</style>
注意点
1.企业开发一般使用外链样式。
2.内联样式不利于实现样式和结构分离,js代码也是的采用外链样式,行为和结构分离,互不影响。
3.导入样式是css2.1推出的,存在兼容问题。外链样式会先加载css样式再加载结构,导入样式会先加载结构再加载样式。用户体验不好。