样式有几种引入方式? link 和 @import有什么区别
1.<style>标签:
<style>
p
{
background-color:balck;
}
</style>
2.<link>标签:
<link rel="stylesheet" type="text/css" href="./index.css">
3.内联样式:
<p style="border:1px solid #fff">hello world</p>
link与import区别:
1.link与页面同时加载,import是在页面完全载入后加载
2.link除了载入css之外还可以定义RSS和连接属性,import只能负责载入
3.link兼容性更高,import需要IE5以上版本
4.采用dom控制样式时,只能使用link,dom无法控制import
文件路径../main.css ./main.css mian.css有什么区别
../main.css返回上一级并查找main.css
./main.css 与 main.css相同,都是在当前路径下查找main.css
console.log()是做什么用的
会在审查元素的console中显示括号中的内容
text-align有几个值,分别有什么作用
text-align: left;文本左对齐
text-align: right;右对齐
text-align: center;居中
text-align: justify;两端对齐,除了最后一行
text-align: justify-all;两端对齐,包括最后一行
text-align: start;内容对齐开始边界
text-align: end;内容对齐结束边界
px,em,rem分别是什么,有什么作用,怎么用
用于表示字体大小,px为像素,用于设置固定值,em和rem是相对大小,em根据父元素当大小乘以前面的倍数,rem根据根元素当大小乘以前面的倍数。
对chrome 审查元素的功能做个简单的截图介绍
如图:
elements表示元素,可以看到html&css代码以及盒模型。
console表示控制台,console.log的字符会显示在这,调试js
sources表示当前页面的资源,图片,代码等资源会保存于此
network表示网络,网络活动会显示在这
timeline时间线,事件发生的顺序
profiles,分析收集代码消耗cpu性能
resources,cookies等保存于此
如下代码,设置 p为几 rem,让h1和p的字体大小相等?
答案为6rem,16X62.5=10px,6X10=60px,所以是6rem。效果如图,代码上传github,