任务五
样式有几种引入方式? link和 @import有什么区别
- 外部样式
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head> - 内部样式
<head>
<style>
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
</style>
</head> - 内联样式
<p style="color:sienna;margin-left:20px">This is a paragraph.</p>
区别
- link是HTML标签，除了加载CSS外，还可以定义RSS等其他事务；@import只能加载CSS。
- link引用CSS时，在页面载入时同时加载；@import需要页面网页完全载入以后加载。
- link无兼容问题；@import在低版本的浏览器不支持。
- link支持使用Javascript控制DOM去改变样式；而@import不支持。
文件路径../main.css 、./main.css、main.css、/main.css有什么区别
- ../main.css:当前层级的上一个层级寻找main.css
- ./main.css:当前层级寻找main.css
- main.css:当前层级寻找main.css
- /main.css：根目录引入main.css
console.log是做什么用的
- 用来分析和调试的一个JS函数，可以在浏览器的开发工具控制台中使用，改变参数值，调试和完善页面。
text-align有几个值，分别有什么作用？写截图说明区别
-
text-align:center/水平居中对齐
text-align:right/把文本排列到右边
text-align:left/把文本排列到左边
text-align：justify/实现两端对齐文本效果
text-align：inherit/从父元素继承text-align属性
代码图
成果图
px、em、rem分别是什么？有什么区别？如何使用
- px称为像素，相对长度单位，像素是固定大小的单元，用于屏幕媒体(即在电脑屏幕上读取)。一个像素等于电脑屏幕上的一个点 (是你屏幕分辨率的最小分割)。
em是相对长度单位，相对于当前对象内文本的字体尺寸，如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。
rem是CSS3新增的一个相对长度单位，只相对根目录即HTML元素。
对chrome 审查元素的功能做个简单的截图介绍
chrome调试
本文章著作权归（饥人谷_MAO）和饥人谷(QQ 群: 222459918) 所有，转载须说明来源
