css简介

什么是css

CSS(Cascading Style Sheet),中文译为层叠样式表,是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言,是实现页面表现的核心元素。

CSS是1996年由W3C审核通过,并且推荐使用的,它以HTML为基础,提供了丰富的格式化功能,如字体、颜色、背景和整体排版等,CSS的引入随即引发了网页设计的一个又一个新高潮,使用CSS设计的优秀页面层出不穷。

标记的概念

熟悉HTML语言的网页设计者,对于标记的概念一定不会很陌生,在页面中各种标记以及位于标记中间的所有内容,组成了整个页面。例如在网页中显示一个标题,以“<h3>”开始,中间是标题的具体内容,最后以“</h3>”结束,如下:<h3>标题内容</h3>,其中的“<h3>”称为起始标记,对应的</h3>称为结束标记,在这两者之间为实际的标题内容。

所有页面都是由各式各样的标记加上标记中间的内容组成的。

传统HTML的缺点

在CSS还没有被引入页面设计前,传统的HTML要实现页面美工上的设计是十分麻烦的,例如我希望标题栏目四变红色,栏目五变绿色,则需要引入<font>标记,如下:

 看上去这样修改并不是很麻烦,而当页面的内容不仅仅只有一段,而是整篇文章时,情况就显得不那么简单了。在这种传统的HTML中需要对每个标题的<font>标记都进行修改,若是整个网站,这样的工作量无法让设计者接受的。

HTML相比CSS为基础的页面设计方法,所体现的劣势主要有以下几点:

1、维护困难(为了修改某个特殊标记的格式,需要花费很多时间,尤其对于整个网站而言,后期修改、维护成本很高)

2、标记不足(本身的标记十分的少,很多标记都是为网页内容服务的,而关于美工样式的标记,如文字间距、段落缩进等标记在HTML中很难找到)

3、网页过胖(由于没有统一对各种风格样式进行控制,因此HTML的页面往往体积过大,占用掉了很多宝贵的带宽)

4、定位困难:在整体布局页面时,HTML对于各个模块的位置调整显得捉襟见肘,过多的<table>标记同样也导致页面的复杂和后期维护的困难。

CSS的引入

对于我上面举的例子,若引入CSS对其中标记进行控制,那么情况完全不同,例如:

其显示效果与上面例子完全一样,可以发现在页面其中的<fong>标记全部消失了,取而代之的是最开始的<style>标记。以及其中的<title>标记的定义,对页面中所有的<title>标记的样式风格通通由这段代码控制,若希望改变标题颜色或者是改变字体,则仅仅需要将这段代码进行如下修改

学习经验个人分享:

在学习制作网页、学习HTML、CSS等各种语言时,多参考其他网站的源代码对快速掌握各种技巧以及将其运用到实际制作中,是非常有好处的。

使用CSS制作网页,一个基础要求就是主流的浏览器之间显示效果要基本一致。通常的做法是一遍编写HTML、CSS代码,一边在两个不同的浏览器上进行浏览,及时调整各个细节,这对深入掌握CSS也是很有好处的。

 

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值