前端学习任务五

问答

样式有几种引入方式? link 和 @import有什么区别？

• 有四种引入方法：
  1.link外链式
  2.@import导入方式
  3.内联式样式
  4.嵌入式样式
• link和 @import有什么区别？
  1.link是属于XHTML标签，@import是CSS提供的一种方式。
  2.加载顺序不同。link引用的CSS会同时被加载，而@import引用的CSS会等到页面全部被下载完再被加载。
  3.浏览器支持不同。@import需IE5.0以上支持，link不需要。
  4.使用dom控制样式时的差别。当使用javascript控制dom去改变样式的时候，只能使用link标签，因为@import不是dom可以控制的。

文件路径../main.css 、./main.css、main.css、/main.css有什么区别

../当前的上一级,./当前文件夹,什么也没有也是当前路径,/

console.log是做什么用的？

用于调试JavaScript，可以看到页面中输出的内容。

text-align有几个值，分别有什么作用？写截图说明区别？

1. text-align:center/水平居中对齐

• text-align:right/把文本排列到右边
• text-align:left/把文本排列到左边
• text-align：justify/实现两端对齐文本效果
• text-align：inherit/从父元素继承text-align属性

7RK7}HD`W%_`MEB609LZ}`7.png

px、em、rem分别是什么？有什么区别？如何使用

• px像素（Pixel），相对长度单位。
  像素px是相对于显示器屏幕分辨率而言的。但是页面全部使用px时，当页面使用ctrl+，ctrl-时造成的页面错乱问题。
• em是相对长度单位。
  相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。em相对的基准点就是浏览器的字体大小，浏览器默认字体大小是16px，也就是1em默认等于16px.如果你想给某个文字设定为14px，就这样写 font-size:0.875em; 公式是14/16=0.875em，如果想要15px，那么就是15/16=0.938em, 例如margin:0.938em; 依次类推，样式表都用em来写的话，就可以解决ctrl+，ctrl-时造成的页面错乱问题。
• rem和em一样也是一个相对单位，为了方便理解，我们就理解rem为root em，顾名思义rem只相对跟节点计算，这就是说只要在根节点设定好参考值，那么全篇的1rem都相等，计算方式同em，默认1rem=16px; 同理你可以设定html { font-size:62.5% } 那么1rem就等于10px，以此类推。。

对chrome 审查元素的功能做个简单的截图介绍

}QB0_O4)VLUW4ML`03$Z4DL.png

如下代码，设置 p为几 rem，让h1和p的字体大小相等?

html根节点大小是16px*62.5%=10px,h1固定就是60px,即1rem=6px,所以60px=6rem。