上期我们说到了css的内部样式,指的是嵌套在HTML语句中的css语句,在学习HTML开始我们就说道要将结构和样式也就是HTML和css分开但是很显然内部嵌套这样的做法并没有实现真正意义上的结构与样式分开,今天我们讲到的外部样式表就能做到这样一点。
既然要真正意义上的分开,那就代表着在两个不同的文件内,所以我们要在我们的项目文件内新建一个css文件,在这个文件内来书写我们的样式,在这个css文件内我们书写样式不在需要任何标签,只需要类名以及对应的属性然后我们在HTML文件中进行调用,但是如果我们直接在HTML文件中调用css文件中的东西是不现实的,显然他们是两个文件所以我们必须要先映入css文件,这里我们采用link标签
<link rel="stylesheet" href="cssurl">其中rel与href都是必须属性,在href中的路径写法与我们之前讲到的图片的路径写法相同。
接下来要带大家了解一个非常好用的工具Chrome调试工具,有了这个工具我们可以在而网页上至今进行源代码的调试,这样就能很方便的监察处那些不符合我们要求的地方,做法就是在我们的网页空白处右击选择检查
上面就是我们的网页源代码,我么可以看到上下分两部分,上面属于HTML文件下面则属于css文件,我们点击上面的某些类就可以直接定义到样式对应的类,当我们点击HTML问价中的类名,或者样式的时候下方的类名并没有弹出来是,那代表着我们的语法或者类名错误这是就要检查了,另外在我们的网页上可以进行调试,也就是说我们可以在网页上的代码进行修改那样我们就可以直接看见修改后的效果,但是这个修改只是暂时的,他并不会直接修改到我们本身的源代码,也就是说上单只能演示,具体的修改我么要回到自己的文件中去修改。
今天的有关外部样式以及一个好用的检查工具等相关内容说完了,下一章我们讲解一下emmet语法。
标签:文件,day6,样式,HTML,类名,我们,css From: https://www.cnblogs.com/222wan/p/17166151.html