CSS基础

1.css的全称:(cascading style sheets)层叠样式表

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

1.内联样式

h1{ color:red; font-size:20px; }

3.外部样式:使用链接引入来加载页面

a:
        
  
b:

4.浏览器默认样式

link 和@import 有什么区别?

link和@import的本质都是为了加载CSS文件,但是还是存在一些细微的差别

  • link属性xhtml标签,而@import完全属于css提供的一种方式。link标签除了加载css以外,还可以做很多其他的事情,比如定义rss,定义rel链接属性,而@import只能加载css。
  • 加载顺序的差别,当一个页面被加载的时候,link引用的css会同时被加载,而@import引用的css会被等到页面被下载完以后再加载,所以有时候浏览@import引用的css加载页面时性能较差。
  • 兼容性的差别。由于@import是CSS2.1提出的所以老的浏览器不支持,@import只有在IE5以上的才能识别,而link标签无此问题。
  • 使用dom控制样式时的差别。当使用javascript控制dom去改变样式的时候,只能使用link标签,因为@import不是dom可以控制的。

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

··/表示当前文件夹所在层级的上一层级;
·/表示当前文件夹所在层级;
/表示根目录;
  • css/a.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:绝对路径;表示a.css的绝对路径,在本地硬盘中真实存在的地址;
  • /static/css/a.css:网络路径;最前面有斜线,表示当前主域名下的路径去寻找a.css文件,例如,主域名为localhost:8080,那么就以licalhost:8080/static/css/a.css的路径去寻找a.css文件,如果没有最前面的斜线,就是在相对当前html的同级目录下以static/css/a.css去寻找a.css;
  • http://cdn.jirengu.com/kejian1/8-1.png:8-1.png被上传到互联网上,这是它在互联网中真实准确的地址网络路径;

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

  1. 直接把图片上传到服务器,用相对路径。
  2. 网上图片获得图片地址,用网络路径,本地图片可以上传到图床获得地址。

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

html:
1.一行代码表示一个内容
2.代码缩写使用tab键
3.标签与它的属性必须小写
4.所有的标签必须合理嵌套
5.大部分标签有属性 格式:属性=“属性值”(多个属性之间用空格隔开)
css:
1.选择器{ 属性:值;} :与值之间空一个空格
2.属性值是0的省略单位
3.块内容缩写
4.ID和class用有意义的单词
5.有可能就用缩写

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

CSS基础_第1张图片
wode.png

Elements 查看元素
Console 控制台,用于调试
Sources 文件资源情况
Network 网络状况
timeline 页面渲染时间

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