CSS基础

CSS的全称是什么?

CSS全称Cascading Style Sheets,层叠样式表


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

CSS有以下几种引入方式:

  • 内联样式

  • 内部样式
    
    
  • 外联样式

    
    

link与@import的区别

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

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

  • 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
    绝对路径,路径指出的位置就是a.css在本地的实际位置
  • /static/css/a.css
    网络路径,代表网站根目录下 static/css 文件夹中的a.css文件的位置
  • http://cdn.jirengu.com/kejian1/8-1.png
    网络路径,代表图片8-1.png在网站上的位置

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

使用标签,将图片地址放在src属性中,可以是本地图片也可以是网络图片


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

  1. 语法全部使用小写;
  2. id和class属性名使用有意义的单词,分隔符用-
  3. 条件允许的情况下尽量使用缩写;
  4. 块内容缩进使代码更清晰可读;
  5. 尽量不使用内联样式;
  6. 属性值为0时省略单位;
  7. 属性名冒号后加一个空格。

认识chrome 开发者工具的功能区

Elements & Styles


CSS基础_第1张图片
Elements&Styles.png

Console


CSS基础_第2张图片
Console.png

Sources


CSS基础_第3张图片
Sources.png

Network


CSS基础_第4张图片
Network.png

你可能感兴趣的:(CSS基础)