简述html css的作用,css简述

.CSS的全称是什么?

Cascading style sheets,层叠样式表。通过CSS和HTML的结合可以实现表现与结构分离。从而提升工作效率,降低维护难度。

CSS有几种引入方式?

在HTML中,引入CSS的方法主要有以下3种:

行内样式、

即在标记的style属性中设定CSS样式,这种方式本质上没有体现出CSS的优势,因此不推荐使用

例:

内部样式、

则将对页面中各种元素的设置集中写在

和之间,对于单一的网页,这种方法很方便

h1{

background: white;

font-size:20px;

}

战狼2

外部样式:分为导入样式和链接样式

但是对于一个包含很多页面的网站,如果每个页面都以内嵌方式设置各自的样式,就失去了CSS带来的

巨大优点,因此一个网站通常都是编写一个独立的CSS样式表文件

A:链接样式

B:导入样式

@import"mystyle.css";

导入样式和链接样式的作用是一样的,唯一的不同是服务对象不一样

@import 为CSS服务,import 是css的一个语法

link是为当前的页服务,link html 的表签可以放在任何地方

本质上,这两种方式都是为了加载CSS文件,但还是存在着细微的差别

差别1:link属于XHTML标签,而@import完全是CSS提供的一种方式。

link标签除了可以加载CSS外,还可以做很多其它的事情,比如定义RSS,定义rel连接属性等,@import就只能加载CSS了。

差别2:加载顺序的差别。当一个页面被加载的时候(就是被浏览者浏览的时候),link引用的CSS会同时被加载,而@import引用的CSS 会等到页面全部被下载完再被加载。所以有时候浏览@import加载CSS的页面时开始会没有样式(就是闪烁),网速慢的时候还挺明显(梦之都加载CSS 的方式就是使用@import,我一边下载一边浏览梦之都网页时,就会出现上述问题)。

差别3:兼容性的差别。由于@import是CSS2.1提出的所以老的浏览器不支持,@import只有在IE5以上的才能识别,而link标签无此问题。

差别4:使用dom控制样式时的差别。当使用javascript控制dom去改变样式的时候,只能使用link标签,因为@import不是dom可以控制的。

从上面的分析来看,还是使用link标签比较好。

HTML书写规范

* 闭合HTML标签

* 声明正确的文档类型DOCTYPE

* 不要使用内联样式

* 在页面的head标签中引入所有的样式表文件。

* 在页面底部引入JavaScript文件

* 不要使用嵌入式JavaScript

* 代码排版要有层次,使用4个空格做为一个缩进层级。

CSS书写规范

* 使用 4 个空格做为一个缩进层级,不允许使用 2 个空格 或 tab 字符。

* 选择器 与 { 之间必须包含空格。

* 属性名 与之后的 : 之间不允许包含空格, : 与 属性值 之间必须包含空格。

* 当一个 rule 包含多个 selector 时,每个选择器声明必须独占一行。

* 不使用内联的style属性定义样式。

* 块内容缩进。

* 属性定义后必须以分号结尾。

* 在可以使用缩写的情况下,尽量使用属性缩写。

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

1.可以直接将图片上传到服务器,在页面使用这张图片;或者将图片存在本地服务器,然后打开本地服务器,然后再在JS BIN上引用图片

2.如果这个图片本来就存在网络上其他的服务器上,可以直接使用图片的网络路径链接的方式在页面上添加url引用这张图片

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值