- 样式有几种引入方式? link 和 @import有什么区别？
- 外部样式表
<link rel="stylesheet" type="text/css" href="index.css">；
href：链接文件的位置
rel：当前文件与链接文件的关系
- 内部样式表
<style type="text/css">
h1 {
color: blue;
font-size: 20px;
}
</style>
- 内联样式表
在想要的改变样式的标签内添加style属性
<h1 style="color:white;font-size:20px">
- link和@import的区别
- link为html标签，@import是css提供的一种方式，link标签还可以对应许多属性，@import只能加载css
- 加载顺序不同，当一个页面被加载的时候，link引用的css会同时被加载，@improt引用的css会在页面加载完成后加载
- 兼容性：link标签兼容性优于@import
- 文件路径../main.css 、./main.css、main.css有什么区别?
./main.css与main.css表示的含义相同，表示调用在当前目录中的main.css文件
../main.css表示调用上级目录中的main.css文件
- console.log是做什么用的
- 方便你调式javascript使用，你可以看到你在页面中输出的内容,里面的内容非常丰富
- console不会打断你页面的操作,console输出内容后你页面还可以正常操作
- text-align有几个值，分别有什么作用
| 值 | 描述 |
|---|---|
| left | 左边对齐。默认值：由浏览器决定。 |
| right | 右边对齐 |
| center | 中间对齐 |
| justify | 两端对齐 |
| inherit | 从父元素继承 text-align 属性的值 |
text-align 规定文本的水平对齐方式。
- px、em、rem分别是什么？有什么区别？如何使用
- px：px是Pixel的缩写，单位名称为像素，px相对于显示器屏幕分辨率而言是相对长度单位，，对于浏览器而言为绝对长度单位
- em 相对长度单位，当前对象内文本的字体尺寸
- rem 相对长度单位。相对于html的font-size计算值的倍数
- 补充：任意浏览器的默认字体单位大小为16px（16像素）。所有未经调整的浏览器都符合: 1em=16px
- 对chrome 审查元素的功能做个简单的截图介绍
审查元素.png
- 如下代码，设置 p为几 rem，让h1和p的字体大小相等?
<h1>饥人谷</h1>
<p>饥人谷</p>
<style>
html {
font-size: 62.5%;
}
p {
font-size: ?rem;
}
h1 {
font-size: 60px;
}
</style>
计算：
任意浏览器的默认字体单位大小为16px，因此html{font-size: 62.5%;}转换为px单位的值为16px*62.5%=10px。
h1和p字体大小相等，则p的字体大小为6rem
- 代码
- 设置body的字体为微软雅黑，字号16px， 行高1.5倍，字体颜色 #333
- 设置段落颜色#000, 首行缩进两个字体宽度，1.5倍行高
task5代码：task5
本文版权归作者和饥人谷所有，转载请注明来源
