CSS 单位理解

CSS 一共有四种引入方式

• 外联式
  1.link
  2.@import url
• 嵌入式
  style 标签一般放在head部分
  <style type="text/css">
  p {
  color:red;
  }
  </style>
• 行内式
  <p style="color:red;">Hello,World</p>

外联式两种方式的区别

• 1.link属于XHTML标签 @import属于CSS2.1以后引进来的。
• 2.当一个页面被加载的时候（就是被浏览者浏览的时候），link引用的CSS会同时被加载，而@import引用的CSS会等到页面全部被下载完再被加载。
• 3.@import可以在css中再次引入其他样式表，比如可以创建一个主样式表，在主样式表中再引入其他的样式表。

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

• 1. ../main.css 是指的是main.css上一层文件夹的路径。
• 2. ./main.css 与 main.css 没有什么本质区别，都是指的是和该文件同一层的路径。

console.log是做什么用的

• 用于调试JS的代码，相对于alert(),可以看见JS中对象的内容。

text-align有几个值，分别有什么作用

text-align这个属性主要控制文本对齐方式
text-align 有三个值：left right center justify inherit
left : 文本向左对齐
center : 文本居中对齐
right:文本向右对齐
justify:文本两端对齐
inherit:从父元素哪里继承对齐方式

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

px:相对长度单位。像素px是相对于显示器屏幕分辨率而言的。
em:相对长度单位。相对于当前对象内文本的字体尺寸。
rem:rem是新增的一个相对单位（root em，根em），这个单位引起了广泛关注。这个单位与em有什么区别呢？区别在于使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素。

• rem和 em单位是由浏览器基于你的设计中的字体大小计算得到的像素值。

• em单位基于使用他们的元素的字体大小。

• rem 单位基于 html 元素的字体大小。

• em 单位可能受任何继承的父元素字体大小影响。

• rem 单位可以从浏览器字体设置中继承字体大小。

• 使用 em单位应根据组件的字体大小而不是根元素的字体大小。

• 在不需要使用em单位，并且需要根据浏览器的字体大小设置缩放的情况下使用rem。

• 使用rem单位，除非你确定你需要 em单位，包括对字体大小。

• 媒体查询中使用 rem单位

• 不要在多列布局中使用 em或 rem,改用%。

• 不要使用 em或 rem，如果缩放会不可避免地导致要打破布局元素。

参考了 rem em 彻底研究 彻底弄懂css中单位px和em,rem的区别

Chrome 工具

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

设置P为6