1. CSS的全称是什么?
Cascading Style Sheets, 层叠样式表，是一种样式表语言，用来描述 HTML 或 XML 文档的呈现。
2. CSS有几种引入方式? link 和@import 有什么区别?
- 样式引入有三种方式：外部样式，内部样式，内联样式
- 外部样式：当样式需要被应用到很多页面的时候，外部样式表将是理想的选择。
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
- 内部样式：当单个文件需要特别样式时，就可以使用内部样式表。
<head>
<style type="text/css">
body {background-color: red}
</style>
</head>
- 内联样式：当特殊的样式需要应用到个别元素时，就可以使用内联样式。 使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性
<p style="color: red; margin-left: 20px">
This is a paragraph
</p>
-
link和@import有什么区别
它们两者是导入CSS文件两种不同方式
- link
<link rel="stylesheet" href="style.css" type="text/css"/> - @import
<style type="text/css">
@import url("style.css");
</style>
- 理论上，
@import和link的唯一区别是@import是CSS下导入样式表的语法而<link>是HTML下的语法。然而，浏览器以不同的方式处理他们。从网页性能的的角度考虑，应该避免用@import。 而且link除了调用css外还可以声明页面链接属性，声明目录，rss等等，而@import就只能调用css。
3. 以下这几种文件路径分别用在什么地方，代表什么意思?
-
css/a.css
相对路径，当前目录下的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
绝对路径， 本地文件地址 -
/static/css/a.css
绝对路径，网站根目录下static文件中css中的a.css文件 -
http://cdn.jirengu.com/kejian1/8-1.png
网站路径，在 cdn.jirengu.com 这个网站上找到图片 8-1.png
4. 如果我想在js.jirengu.com上展示一个图片，需要怎么操作?
- 如果这个图片本来就存在网络上， 可以直接使用图片的网络绝对地址
- 如果图片在本地，可将图片上传到某个网址，生成一个线上网址，或将图片文件存于
本地服务器。例如： http://chuantu.biz/upload.php
5. 列出5条以上html和 css 的书写规范
- HTML:
- 用两个空格来代替制表符（tab） -- 这是唯一能保证在所有环境下获得一致展现的方法。
- 对于属性的定义，确保全部使用双引号，绝不要使用单引号。
- 不要在自闭合（self-closing）元素的尾部添加斜线
- 为每个 HTML 页面的第一行添加标准模式（standard mode）的声明，这样能够确保在每个浏览器中拥有一致的展现。
<!DOCTYPE html>
<html>
<head>
</head>
</html>
- 通过明确声明字符编码，能够确保浏览器快速并容易的判断页面内容的渲染方式。
- CSS:
- 为选择器分组时，将单独的选择器单独放在一行。
- 为了获得更准确的错误报告，每条声明都应该独占一行。
- 所有声明语句都应当以分号结尾。最后一条声明语句后面的分号是可选的，但是，如果省略这个分号，你的代码可能更易出错。
- 对于以逗号分隔的属性值，每个逗号后面都应该插入一个空格（例如，
box-shadow）。 - 避免为 0 值指定单位，例如，用 margin: 0; 代替 margin: 0px;。
其他的HTML 和 CSS 规范： http://codeguide.bootcss.com/
6. 截图介绍 chrome 开发者工具的功能区
q6
- elements: 查看和修改html
- style: 调试CSS
- console: JavaScript console
- sources: 协同调试JavaScript, 比如加入断点等
- network: 查看网络请求
- timeline: 时间轴，页面加载的时间
- profiles: CPU, JavaScript 的性能
- application: 查看页面加载的资源。操作HTML5 Database, Cookies, AppCache等。
网友评论