CSS基础

作者: Jeff12138 | 来源:发表于2017-08-04 00:50 被阅读0次

    CSS的全称是什么?

    CSS,即Cascading Style Sheets,层叠样式表。是一种用来表现Html或Xml等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。

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

    CSS的引入方式有以下4种:
    1、行内式,即直接将元素的样式利用style=""写在Html标签内部;
    2、内嵌式,即将元素样式集中写在<head></head>标签内的<style></style>标签中;
    3、链接式,即将元素样式集中写在外部CSS文件中,再根据Html规则利用link将外部CSS文件引入Html文件内;
    4、导入式,即将元素样式集中写在外部CSS文件中,再根据CSS规则利用@import将外部CSS文件引入Html文件内。
    一般来说,上述4种引入方式的优先级为:行内>内嵌>链接>导入。但在实际情况下,内嵌、链接和导入在同一个文件头部,谁离相应的代码近,谁的优先级高。

    其中,link(链接式)和@import(导入式)的主要区别在于,在浏览器打开网页时,前者(link)会先加载CSS文件,再加载Html文件,以保证网页能够完整地呈现;而后者(@import)会先加载Html文件,再加载CSS文件,这就导致了在网页代码量较大的情况下,浏览器可能会先显示出未经渲染的Html页面,再加载CSS样式。另外,相较于@import而言,link不存在浏览器的兼容问题。因此在实际操作中,更推荐使用link(链接式)进行编写。

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

    相对路径:
    css/a.css //当前目录下的css文件夹中的a.css文件
    ./css/a.css //当前目录下的css文件夹中的a.css文件
    b.css //当前目录下的b.css文件
    ../imgs/a.png //上级目录下的imgs文件夹中的a图片

    绝对路径:
    /Users/hunger/project/css/a.css //本地绝对路径下的a.css文件

    网络路径:
    /static/css/a.css //主域名下的static文件夹中的css文件夹中的a.css文件
    http://cdn.jirengu.com/kejian1/8-1.png //某图片文件在服务器端的地址

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

    1、将本地图片上传到服务器,再引入网页内,此方法会加重服务器的负担;
    2、直接调用图片原有的网络链接,引入自己开发的网页,此方法有一定风险图片会丢失。

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

    Html
    1、页面首行添加标准模式声明 <!DOCTYPE html>;
    2、使用Tab键控制代码缩进;
    3、除开头的DOC和'UTF-8'或者head里特殊情况可以大写外,其它都为小写,css类都为小写;
    4、为文档设置正确的语言 lang="zh-CN";
    5、避免使用@import引入文件。
    CSS
    1、命名标签时应使用英文或英文缩写,避免使用拼音;
    2、对于属性值或颜色参数,省略小于 1 的小数前面的 0;
    3、十六进制值应该全部使用小写,且尽可能简写;
    4、尽量不使用 !important 声明;
    5、将媒体查询尽可能地放在相关规则的附近。

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

    相关文章

      网友评论

        本文标题:CSS基础

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