任务五-HTML(2)

课程任务

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

答:

  • 外部样式表:将css的样式代码写在一个单独的文件里面,一般位于文档的头部并且使用link标签将其引入。
    <link rel="stylesheet" type="text/css" href="index.css">
  • 嵌入样式表:将css的样式代码直接写在<style>标签里面
    <style type="text/css">body{background-color:red}</style>
  • 内联样式表:将css的样式代码直接写在要修饰的html的标签里面
    <body style="background-color:yellow">
    link 和 @import 都作用于外部样式引用,区别在于:
    ①link更多书写通用样式,提高复用效率。②@import只能加载css,而link除了加载css之外还能定义RSS等。③@import是不支持低版本浏览器,是在css2.1提出的。④link引用外部样式表示后是与页面同时加载,而@import是需要等页面加载完后再加载。⑤link支持使用Javascript控制DOM去改变样式;而@import不支持。

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

答:../main.css是表示上一级目录下面的文件,而./main.css和main.css都是表示当前目录下的文件。

3.console.log是做什么用的?

答:就是把信息展示在控制台上,在开发调试中用得。

4.text-align有几个值,分别有什么作用?

  • justfy:两端对齐文本居中的效果
  • center:文本居中的效果
  • right:靠右对齐
  • left:靠左对齐

5.px、em、rem分别是什么?有什么区别?如何使用

  • px -像素是一个相对单位。是指显示器屏幕物理设备上最小的点,不是一定的数值。
  • em-尺寸也是相对单位,但是相对的浏览器内默认字体尺寸。默认情况下1em=16px;
  • rem-是css3新增的相对长度单位,但是它是相对HTML中的根元素。通过它既可以做到只修改根元素就成比例地调整所有字体大小,又可以避免字体大小逐层复合的连锁反应。

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

Chrome浏览器审查元素功能

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

<h1>饥人谷</h1> 
<p>饥人谷</p>
 <style> 
html{ font-size: 62.5%; } 
p{ font-size: ?rem; } 
h1{ font-size: 60px; } 
</style>```
答:由于系统默认是16px,所以根元素字体大小为0.625*16=10px。rem是相对根元素的单位,所以为了使p和H1字体大小相等,60/10=6rem.
***
**本教程版权归饥人谷_鬼脚七和饥人谷所有,转载须说明来源**
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,680评论 1 92
  • 课程目标 掌握样式的几种引入方式能使用Chrome开发工具进行基本页面调试熟悉常见文本样式熟悉单位的使用 课程建议...
    饥人谷_江君阅读 3,240评论 0 0
  • 1.样式有几种引入方式? link 和 @import 有什么区别? 样式的写法有五种,其中一种是浏览器的缺省设置...
    饥人谷_沈梦圆阅读 2,720评论 0 0
  • Version one 问答 一、样式有几种引入方式? link 和 @import有什么区别? 嵌入式: 在Ht...
    吴晗君阅读 3,838评论 0 0
  • 虽然人不容易饿死,但贫富差距却在不断增大。社会上仍然存在着明显的阶层,不管是来自经济、教育,还是衣食住行。...
    猫咪的夏目阅读 1,456评论 0 0