任务5-html2

问答题

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

  • 浏览器缺省设置
  • 外部样式表
 <link rel="stylesheet" type="text/css" herf="./xxx.css">
  • 内部样式表(在标签内部)
<style tyle="txt/css">
        p {
             background-color: bule;
}
</style>
  • 内联样式表
<p style="border: 1px solid #fff;">xx</p>

link和@import的区别?

link标签语法:
<link rel="stylesheet" type="txt/css" herf="./xxx.css">```
***

@import语法:
.css中为: @import url(./css)
.html中为:<style>
@import url(./css)
</style>```

两者区别

区别1:link是XHTML标签,除了加载CSS外,还可以定义RSS等其他事务;@import属于CSS范畴,只能加载CSS。
区别2:link引用CSS时,在页面载入时同时加载;@import需要页面网页完全载入以后加载。
区别3:link是XHTML标签,无兼容问题;@import是在CSS2.1提出的,低版本的浏览器不支持。
区别4:ink支持使用Javascript控制DOM去改变样式;而@import不支持。


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

../main.css(上一级目录中的main.css)-相对路径 、./main.css(当前目录中的main.css)-相对路径、
main.css(=./main.css)-相对路径

console.log是做什么用的?

  • 调式javascript。你可以看到你在页面中输出的内容。
  • 相比alert他的优点是:
  1. 他能看到结构话的东西,如果是alert,淡出一个对象就是[object object],但是console能看到对象的内容。
  2. console不会打断你页面的操作,如果用alert弹出来内容,那么页面就死了,但是console输出内容后你页面还可以正常操作。

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

left 左对齐
rigth 右对齐
center 中间对齐
justify 两端对齐(没尝试成功)

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

  • px : 像素 (pixel)。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。
  • em和rem都是相对单位。em是相对于父节点的字号来计算。rem只相对根节点<html>计算,这就是说只要在根节点设定好参考值,那么全篇的1rem都相等,计算方式同em,默认1rem=16px;
  • 重要:rem是css3属性,ie678不支持rem属性,需要做兼容处理。
  • 如何使用?
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <style>
        html {
            font-size: 30px;
        }
    </style>
    <title>Document</title>
</head>

<body>
    <h1>px、em、rem如何使用?
    <p style="font-size: 2em;">猜猜我等于多少px{继承父级h1(h1默认为2em)所以我是120px}
    </p>

<p style="font-size: 2rem;">猜猜我等于多少px(根元素为30px,所以我是60px)
</p>
<p style="font-size: 16px;">猜猜我等于多少px(16px就是16px)

</p>


</html>

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

98D30135-3586-4569-8838-FD882030DCC9.jpeg

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

QQ20160713-0.png

答:根元素为62.5%=10px,h1的size为60px,要让h1字体大小=p字体大小,p{font-size: 6rem;}。


本文版权归本人和饥人谷所有,转载请注明来源

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 课程目标 掌握样式的几种引入方式能使用Chrome开发工具进行基本页面调试熟悉常见文本样式熟悉单位的使用 课程建议...
    饥人谷_江君阅读 3,315评论 0 0
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,711评论 1 92
  • 样式有几种引入方式? 外部样式 link(链接)和@import(导入) 内部样式(标签内部) p{color:r...
    饥人谷_锋阅读 1,891评论 0 0
  • 《殇》 来世,我愿做深山里的一棵树 人间风雨不知 你我千年不遇 《寂》 归于沉寂 始于对未来茫然的年少之前 和对世...
    陈素阅读 1,697评论 1 0
  • 暑假事多,本拒绝追剧。无奈偶刷手机,几乎满屏皆在吐槽《我的前半生》。向来觉得马伊莉特别适合出演都市情感剧,又...
    情主阅读 2,615评论 0 4

友情链接更多精彩内容