HTML2

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

样式引入方式：

//外部样式表
<head>
  <link rel="stylesheet" type="text/css" href="index.css">
</head>
//内部样式表
<style type="text/css">
  p{
      color:red;
 }
</style>
//内联样式
<p style="color:red;">测试</p>

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

../main.css：在目录上一级寻找main.css。
./main.css,main.css：在当前目录下寻找main.css。

console.log是做什么用的？

console.log主要是用来调试JavaScript用的。可以看到对象中的内容，并且不会弹出窗口打断操作。

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

text-align:left;//文本左对齐
text-align:right;//文本右对齐
text-align:center;//文本居中
text-align:justify;//文本两端对齐
text-align:inherit;//从父元素继承文本属性的值

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

px：固定大小像素；
em：相对于父元素的像素大小，如果父元素没有设置则逐级向上查找；
rem：相对于根节点<html>的像素大小。

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

Paste_Image.png
Paste_Image.png

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

 <h1>饥人谷</h1>
 <p>饥人谷</p>
 <style>  
  html{
    font-size: 62.5%;
  }
  p{
    font-size: 6rem;
  }
  h1{
    font-size: 60px;
  } 
 </style>

浏览器的默认字体大小为16px,而根节点<html>的font-size设置为62.5%，所以<html>字体大小为10px,所以应设为6rem。