Task 6

作者: DHFE | 来源:发表于2017-09-29 19:26 被阅读6次

    CSS全称是什么?


    Cascading-Style-Sheets(层叠样式表)

    • 层叠就是浏览器对多个样式来源进行叠加,最终确定结果的过程,css之所以有"层叠"概念,是因为有多个样式来源。
    • css样式来源:内联样式,内部样式,外部样式,浏览器用户自定义样式,浏览器默认样式。
    • 按照其优先级为内联样式>内部样式>外部样式>浏览器用户自定义样式>浏览器默认样式规则,来为最终的样式呈现服务。
    • 如果有important,则优先级最高。

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

    • 内联样式
    • 内部样式
    • 外部样式
    区别:
    • link是XHTML标签,除了加载CSS外,还可以定义RSS等其他事务;@import属于CSS范畴,只能加载CSS。
    • link引用CSS时,在页面载入时同时加载;@import需要页面网页完全载入以后加载。
    • link是XHTML标签,无兼容问题;@import是在CSS2.1提出的,低版本的浏览器不支持。
    • link支持使用Javascript控制DOM去改变样式;而@import不支持。
      @import url(style.css)@import url("style.css")是最优的选择,兼容的浏览器最多。从字节优化的角度来看@import url(style.css)最值得推荐。

    css/a.css
    ./css/a.css
    

    当前目录下的css文件夹内的a.css文件

    b.css
    

    名为b的.css文件

    ../imgs/a.png
    

    父文件夹下的imgs文件夹内的a.png文件

    /Users/hunger/project/css/a.css
    

    Users文件下的hunger文件夹下的project文件夹下的css文件夹内的a.css文件(绝对路径)

    /static/css/a.css
    

    某目录下的static文件夹内的css文件夹内的a.css文件

    http://cdn.jirengu.com/kejian1/8-1.png
    

    表示一个互联网的资源存放地址,绝对路径(URL),指向一个.png文件


    如果我想在js.jirengu.com上展示一个图片,需要怎么操作?

    将图片上传至server中,然后使用URL打开图片。
    将图片上传至html文件当前目录下,使用相对目录打开图片。

    出5条以上html和 css 的书写规范

    HTML

    • 用两个空格来代替制表符(tab) – 这是唯一能保证在所有环境下获得一致展现的方法。
    • 嵌套元素应当缩进一次(即两个空格)。
    • 对于属性的定义,确保全部使用双引号,绝不要使用单引号。
    • 不要在自闭合(self-closing)元素的尾部添加斜线 – HTML5 规范中明确说明这是可选的。
    • 不要省略可选的结束标签(closing tag)(例如,</li>或 </body>)。

    CSS

    • 用两个空格来代替制表符(tab) – 这是唯一能保证在所有环境下获得一致展现的方法。
    • 为选择器分组时,将单独的选择器单独放在一行。
    • 为了代码的易读性,在每个声明块的左花括号前添加一个空格。
    • 声明块的右花括号应当单独成行。
    • 每条声明语句的 :后应该插入一个空格。
    • 为了获得更准确的错误报告,每条声明都应该独占一行。
    • 所有声明语句都应当以分号结尾。最后一条声明语句后面的分号是可选的,但是,如果省略这个分号,你的代码可能更易出错。
    • 对于以逗号分隔的属性值,每个逗号后面都应该插入一个空格(例如,box-shadow)。
      不要在 rgb()、rgba()、hsl()、hsla() 或 rect()值的内部的逗号后面插入空格。这样利于从多个属性值(既加逗号也加空格)中区分多个颜色值(只加逗号,不加空格)。
    • 对于属性值或颜色参数,省略小于 1 的小数前面的 0 (例如,.5代替 0.5;-.5px代替 -0.5px)。
    • 十六进制值应该全部小写,例如,#fff。在扫描文档时,小写字符易于分辨,因为他们的形式更易于区分。
    • 尽量使用简写形式的十六进制值,例如,用 #fff代替 #ffffff。
    • 为选择器中的属性添加双引号,例如,input[type="text"]。只有在某些情况下是可选的,但是,为了代码的一致性,建议都加上双引号。
    • 避免为 0 值指定单位,例如,用 margin: 0;代替 margin: 0px;。

    菜鸟教程——HTML、CSS规范
    知乎:HTML 和 CSS 代码结构如何写更加规范?
    HTML+CSS编写规范

    说到规范,大部分公司都会自己一套代码规范,这是肯定的,从代码的可读性,可维护性角度出发。
    也希望自己以后能写出健壮的代码。


    截图介绍 chrome 开发者工具的功能区

    Chrome开发者工具

    相关文章

      网友评论

          本文标题:Task 6

          本文链接:https://www.haomeiwen.com/subject/gyzvextx.html