《使用简洁html实现与css对接》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、CSS初探索：使用简洁的HTML实现与CSS的对接佟禺明内蒙交通职业技术学院摘要：使用HTML语言编辑网页的框架，使用CSS语言装饰网页已经是当前网页设计的主流趋势。HTML语言中很多的标签和属性在使用的CSS语言后都可以不再使用了，仅仅是框架的构建大大减少了网页建设的工作量，又能使网页快速打开。关键词：HTML；CSS；标签；属性HTML语言一直使用至今，各式各样让人眼花缭乱的网页都离不开HTML语言。作为重要的网页语言，在网页技术日益进步的时代里，HRML扮演者怎样的角色？如何更有效地使用HTML语言？这一切还要从其功能说起。一、HTM

2、L功能回顾HTML语言创建之初为一群科学家所使用。HTML仅仅被科学家用来为信息提供结构。随着网页技术的推广，当更多科学家以外的人开始使用网页，人们开始对网页的要求越来越多。Web设计师开始使用标签来替代结构信息控制展现效果，于是越来越多的标签开始涌现出来。随之而来的则是各种属性。到今天，HTML语言可以分成四个部分：结构元素、内容元素、修饰元素和扩展元素。其中结构元素和内容元素是HTML语言的基础，最常用的部分。我们学习这两部分元素来构建HTML语言的结构。最初的HTML语言可以用下面的语句简单演示：

4、种繁复样式中的大多数。比如：不同颜色和大小的字体、镶嵌图片、突出的文字和链接等等。但是，HTML语言的创作目的是以为信息提供结构为主的，尽管后期添加了各种标签及属性，也不能改变HTML语言在应用上的狭隘。单单使用HTML语言编辑网页不仅会让编程的工作变得无比繁杂，而且想要展示的网页的效果也不尽如人意。尤其是在CSS诞生之后，人们越来越发现CSS的强大弥补了HTML的不足。在此反思HTML语言的功能后，发现修饰元素和扩展元素的功能和CSS语言的功能相同，而且在灵活性上大有不如。我们简单地从字体、图片和网页布局三方面来对比一下。1.文字字体大小

5、使用CSS我们可以很随意地设置字体的大小，比如：“font-size:1.2em;”；但是HTML语言中缺乏与之对应的字体的大小，使用字体显得小些，使用字体显得大些，使用又不被识别,也就是说，HTML语言中字体的大小不能随意设置，这在编辑网页过程中很难达到理想的效果。字体间距使用CSS我们可以随意设置行高，调节上下行的间距，比如“line-height:150%”；但是HTML语言没有相应的语句进行行高的设置。对于文字较多的网页，我们无法使用HTML语言

6、来使文字呈现多样化，清晰化的效果。2.图片图片的重复使用使用CSS我们可以随意在横向或纵向上使用图片，使一张图片可以连续排列而无缝隙，比如：“background-repeat:repeat-x”；使用HTML则需要计算网页的宽度等，对图片进行切割使之适应页面，工作量明显比使用CSS加大了很多。图片的插入方式使用CSS我们可以在任何需要的地方写下“background:url…”，加入图片；HTML语言除了和以外，很少有标签允许加入图片，而这两种标签又都有其局限性，而标签的属性也没有办法

7、完全满足复杂的网页对图片高质量和灵活的需求。1.布局Table的使用令人望而生畏暂且不谈使用了CSS的诸多好处，只是有过编辑网页经验的人员就能知道，单单HTML语言编辑网页时，需要大量使用表格是何其的繁琐和令人恼怒无奈的选择。对于表格中有文字的每一行都得进行字体的设置，即使那么多行的设置都相同，我们依然得花费大量的时间进行重复建设。二、HTML与CSS相辅相成CSS的诞生真正解放了HTML语言，可以想象没有CSS以前的HTML就好像舞台上的演员，不仅仅要一个人扮演多种角色而且还得兼职扮演道具。CSS语言是HTML语言的辅助，相当于人们常说的

8、软包装。我们的网页建设可以看成是与楼房的建设一样的，使用HTML建造楼房，主体框架，承重墙，进户门等等，但是这样的楼房恐怕真的很难令人产生美感！于是我们使用CSS语言对其进行装饰