CSS像素

  1. 样式有几种引入方式?link@import有什么区别
    • 样式有几种引入方式
      • 外部引入样式表
        其中<link rel="stylesheet" href="#">标签就是用来引入外部的CSS文件
      • 内部的样式表
        <style></style>两个标签中直接写入CSS代码
      • 内嵌在HTML代码中的样式
        例如,<p style="font-size: 12px;"><p>在HTML标签中的style属性中写入CSS代码。
    • link@import有什么区别
      其中link是为HTML服务的,而@import是为CSS服务的,@import只能用在CSS环境中引入CSS文件,即在<style>@import url();</style>或者在CSS文件中加入。
  2. 文件路径../main.css./main.cssmain.css有什么区别
    • ../main.css表示在上一级目录中的main.css文件
    • ./main.css表示在当前目录下的main.css文件
    • main.css也表示当前目录下的main.css文件
  3. console.log是做什么用的
    console.log是控制台日志,作用是用来调试JS,可以把想要的信息呈现在控制台。相比aler()console.log不会打断程序的运行,效率更高。
  4. text-align有几个值,分别有什么作用
    text-align的值有:

left|right|center|jsutify

- `text-align`的值用来定义行内文字相对于父元素的对齐
- 应用于块级元素
- 是可以被继承的
- **并不能控制块元素对齐,就是不能用来给块元素居中定位**

其中left让内容相对于父元素左对齐,right让内容相对于父元素右对齐,center让内容相对于父元素居中,justify让内容相对于父元素两边对齐,中间文字的间隔平均拉大。

  1. pxemrem分别是什么?有什么区别?如何使用

    • px
      px像素(Pixel)。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。这边所指的像素是CSS像素,就是为了WEB编程所设计的像素概念。那为什么说CSS像素是相对的单位呢,因为例如一张width=300px的图,这张图是可以缩放的,但是它300像素的宽并不会改变,只不过当放大时一个CSS像素覆盖了多个设备像素或缩小时一个设备像素覆盖了多个CSS像素。
      CSS像素缩放
    • em
      相对单位,这个单位表示元素的font-size的计算值。如果用在font-size属性本身,它会继承父元素的font-size。意思是如果其他属性使用em这个单位,相对的是当前font-size的值,如果设置font-size属性,相对的是父元素font-size的值。
    • rem
      CSS3才出现相对单位,意思是root em,相对于的是根节点htmlfont-size大小。
      这些单位属于长度单位<length>,在使用过程中只要在<number>后加一个单位就可以了,例如px,em,rem
  2. 对chrome 审查元素的功能做个简单的截图介绍


    Chrome审查元素123

    Chrome审查元素4

    Chrome审查元素5

    Chrome审查元素6

    图中的1区域主要用来HTML的调试HTML元素,2区域主要查看选定元素的CSS样式,3区域是控制台区域用来调试JS,4区域查看网站的原文件,可以做JS的断点调试,5区域查看所发出的网络请求,6区域查看cookies等。

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

         <h1>老虎爱吃母鸡</h1>
         <p>老虎爱吃母鸡</p>
         <style> 
             html { font-size: 62.5%; } 
             p { font-size: ?rem; }
             h1{ font-size: 60px; }
         </style>
    

p为6rem时,h1p的字体大小相等

task05

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 160,108评论 4 364
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,699评论 1 296
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 109,812评论 0 244
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,236评论 0 213
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,583评论 3 288
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,739评论 1 222
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,957评论 2 315
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,704评论 0 204
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,447评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,643评论 2 249
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,133评论 1 261
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,486评论 3 256
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,151评论 3 238
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,108评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,889评论 0 197
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,782评论 2 277
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,681评论 2 272

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,630评论 1 92
  • CSS基础 本文包括CSS基础知识选择器(重要!!!)继承、特殊性、层叠、重要性CSS格式化排版单位和值盒模型浮动...
    廖少少阅读 3,006评论 0 40
  • 本文主要是起笔记的作用,内容来自慕课网. 认识CSS样式 CSS全称为“层叠样式表 (Cascading Styl...
    0o冻僵的企鹅o0阅读 2,551评论 0 30
  • “以前我认为那句话很重要,因为我相信有些事说出来就是一生一世。现在想想,说不说也没有什么区别。有些事情是会变的,我...
    猫想阅读 296评论 0 1
  • 有一个方法论,除了我经常跟团队灌输的“复盘方法论”之外,我经常用来类比和论证的方法论。好像之前也跟大家分享过,不知...
    茉莉大大阅读 139评论 0 0