6 CSS基础

作者: 好好顽 | 来源:发表于2017-06-27 19:21 被阅读20次
  1. CSS的全称是什么?
    答:Cascading Style Sheets ,层叠样式表,html布局文件。

  2. CSS有几种引入方式? link 和@import 有什么区别?
    答:4种。

  3. 内联:样式直接写入标签中<td style="color:#c00; font-size:15px; line-height:18px;>

  4. 嵌入:样式写入html头标签head里<head><style>.content {background: red; }</style></head>

  5. 链接:样式以文件方式从link标签引入<link rel=stylesheet type="text/css" href="example.css">

  6. 导入:样式使用 CSS 规则引入外部 CSS 文件<style>@import url(style.css);</style>
    区别:@import 为CSS服务。link是为当前的页服务。
    link 属于 HTML,通过 <link> 标签中的 href 属性来引入外部文件,而 @import 属于 CSS,所以导入语句应写在 CSS 中,要注意的是导入语句应写在样式表的开头,否则无法正确导入外部文件。
    当 HTML 文件被加载时,link 引用的文件会同时被加载,而 @import 引用的文件则会等页面全部下载完毕再被加载。
    @import 是 CSS2.1 才出现的概念,所以如果浏览器版本较低,无法正确导入外部样式文件。

  7. 以下这几种文件路径分别用在什么地方,代表什么意思?

  • 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
    绝对路径:User文件夹下hunger文件夹下project文件夹下css文件夹下a.css
  • /static/css/a.css
    绝对路径,在网站服务器通过该路径找到a.css文件
  • http://cdn.jirengu.com/kejian1/8-1.png
    同上
  1. 如果我想在js.jirengu.com上展示一个图片,需要怎么操作?
    答:一种是将图片上传到该网站的服务,第二种是引用图片链接。当然第二种的时间空间效率就很高了。
  2. 列出5条以上html和 css 的书写规范
  3. 引入JS库文件, 文件名须包含库名称及版本号及是否为压缩版, 比如jquery-1.4.1.min.js; 引入插件, 文件名格式为库名称+插件名称, 比如jQuery.cookie.js。
  4. 充分利用无兼容性问题的html自身标签, 比如span, em, strong, optgroup, label,等等;
  5. 需要为html元素添加自定义属性的时候, 首先要考虑下有没有默认的已有的合适标签去设置, 如果没有,
    可以使用须以”data-”为前缀来添加自定义属性,避免使用”data:”等其他命名方式;
  6. 语义化html, 如 标题根据重要性用h*(同一页面只能有一个h1), 段落标记用p, 列表用ul, 内联元素中不可嵌套块级元素;
  7. 尽可能减少div嵌套,
  8. 书写链接地址时, 必须避免重定向
    能以背景形式呈现的图片, 尽量写入css样式中;
  9. 截图介绍 chrome 开发者工具的功能区

    答:
  10. Elements看到chrome渲染页面所需要的的HTML、CSS可以编辑这些内容更改页面显示效果。
  11. Console: 显示各种警告与错误信息,并且可以直接在上面写js代码。
  12. Sources: 看资源文件,主要用来调试js。
  13. Network: 页面向服务器请求了哪些资源、资源的大小以及加载资源花费的时间,哪些资源不能成功加载,查看HTTP的请求头,返回内容等。
  14. Timeline:加载页面时花费时间的完整分析,所有事件,从下载资源到处理Javascript,计算CSS样式等花费的时间都展示在Timeline中;
  15. Profiles: 分析web应用或者页面的执行时间以及内存使用情况;
  16. Resources: 对本地缓存(IndexedDB、Web SQL、Cookie、应用程序缓存、Web Storage)中的数据进行确认及编辑;
  17. Audits: 分析页面加载的过程,进而提供减少页面加载时间、提升响应速度的方案;

相关文章

  • (6)-基础CSS

    1. CSS的全称是什么? Cascading Style Sheets, 层叠样式表。 2. @charset有...

  • 6 CSS基础

    CSS的全称是什么?答:Cascading Style Sheets ,层叠样式表,html布局文件。 CSS有几...

  • CSS基础(6)

    饥人谷学习第6天 CSS 用来给网页添加样式的代码。 外部样式表(推荐)1.通过 引入CSS;2.通过 @im...

  • CSS/CSS3

    CSS基础 《图解CSS》CSS简介[https://www.jianshu.com/p/a42e4ff8b7d6...

  • 阅读记录

    js语言基础类 typescripts es6 css语法基础 你未必知道的49个CSS知识点 工具类 webpa...

  • React Native 学习

    基础 JavaScript ES6/ES7 TypeScript选学 CSS Flex 布局(css中的重点) R...

  • 2019-06-03

    css基础知识 完善 表单: 框架集 ie6png图片的修复 css3过渡动画: 例如 css3 阴影 : 语法:...

  • 入门6 css基础

    1.CSS的全称是什么? 层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTM...

  • task 6 css基础

    1. CSS的全称是什么? CSS全称是 Cascading Style Sheets, 层叠样式表 2. CSS...

  • 任务6 CSS基础

    CSS的全称 Cascading Style Sheets,层叠样式表。是一种样式表语言,用于为HTML文档定义布...

网友评论

    本文标题:6 CSS基础

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