第1课:CSS是什么?

CSS是Cascading Style Sheets (CSS) 是一门指定文档该如何呈现给用户的语言。,用于为HTML文档定义布局。例如,CSS涉及字体、颜色、边距、高度、宽度、背景图像、高级定位等方面。

也许你曾听说过CSS,但并不真正清楚CSS到底是什么。在这一课,你将学到更多CSS的知识,并了解CSS可以做些什么。

CSS是Cascading Style Sheets(级联样式表)的缩写,是一门指定文档该如何呈现给用户的语言。

CSS是为了解决内容与表现分离的问题而设计的。

在HTML中,使用标记语言来描述文档的内容。

使用CSS来指定它的样式。

CSS样式定义如何显示 HTML 元素,帮助您将文档信息的内容 和如何展现它的细节相分离。

可以用CSS做什么?

CSS涉及网页的字体、颜色、边距、高度、宽度、背景图像、定位等多个方面。

HTML可以用于为网站添加布局效果。而CSS则提供了更多选择,而且更为精确、完善。现在所有浏览器都支持CSS。

经过下面若干课的学习之后,你将能够制作自己的CSS样式表,为自己的网站添加漂亮的效果。

CSS跟HTML的区别在哪里?

HTML用于结构化内容;CSS用于格式化结构化的内容。

嗯,这听上去有点技术性并令人疑惑。不过没关系,我们继续学习。过会儿你就明白了。

在Tim Berners-Lee发明万维网(World Wide Web)的那个年代,HTML语言是唯一用于给文本添加结构的语言。作者可以通过声明“这是一个标题”(利用h1标签)或“这是一个段落”(利用p标签)的方式来标记文本。

随着Web逐渐流行起来,网页设计者们开始寻求为网页增添布局的可能性。为此,当时的浏览器厂商们(网景公司和微软公司)发明了一些新的HTML标签(比如<font>等),以引入了新的布局——而非新的结构。

这也导致了原本用于进行文本的结构化的标签(比如<table>等)越来越多地被误用于进行页面的布局。许多新的布局标签(比如<blink>)只有一种浏览器支持。“您需要使用某某浏览器来浏览本页面”成为当时常见于许多网站的声明。

CSS的发明正是为了改善这一状况,它为Web设计师们提供了完善的、所有浏览器都支持的布局能力。而且,文档的表现样式与内容的分离,也令网站维护容易了许多。

采用CSS有哪些好处?

CSS是Web设计界的一次革命。

CSS的具体优点包括:

  • 通过单个样式表控制多个文档的布局;

可以避免重复 ,更容易维护。

例如:您的网站可能有成千上万的页面外观相似。使用CSS,您可以将样式信息存储在公共的文件中以供所有的页面共用。
当用户显示页面时,用户的浏览器将样式信息和页面内容一同加载。

  • 更精确的布局控制;
  • 为不同的媒体类型(屏幕、打印等)采取不同的布局;
  • 无数高级、先进的技巧。

在下一课,我们将深入考察CSS的工作原理,以及如何上手。

125jz网原创文章。发布者:江山如画,转载请注明出处:http://www.125jz.com/4951.html

(6)
江山如画的头像江山如画管理团队
0基础学CSS
上一篇 2020年2月22日 下午3:38
第2课:CSS的工作原理
下一篇 2020年2月22日 下午4:08

99%的人还看了以下文章

  • 36个漂亮的CSS3动态按钮,纯CSS制作无图片

    36个漂亮的纯CSS制作的动态按钮。

    2020年2月2日
    11.0K0
  • 如何为需要打印的网页设置单独的css样式

    项目开发:同一个页面,需要在浏览器中浏览是一种样式,而当要打印这个页面时候,又需要呈现另一种样式。 此时可以用link标签中的media属性解决此问题。 如下面这两个引用: <link href=”stylesheets/print.css” media=”print” rel=”stylesheet” type=”text/css” /> &l…

    2019年11月20日
    15.1K0
  • 第10课:外边距和内边距

    上一课,你学习了盒状模型。在这一课,我们将了解如何通过设置margin(外边距)和padding(内边距)这两个CSS属性来改变元素的显示。 为元素设置外边距 为元素设置内边距 为元素设置外边距 一个元素有上(top)、下(bottom)、左(left)、右(right)四个边。外边距(margin)表示从一个元素的边到相邻元素(或者文档边界)之间的距离。可…

    2020年2月25日
    8.8K0
  • 跟永哥学HTML5(5):正确使用HTML5的nav和figure

    这节课就给大家讲解常见的HTML5标签错误使用写法,帮助大家理解并学会正确使用HTML5的nav和figure。 1、不要把所有列表式的链接放在nav里 随着HTML5引入了 30个新元素,我们在构造语义化和结构化的标签时的选择也变得有些不慎重。也就是说,我们不应该滥用超语义化的元素。不幸的是,nav就是这样一个被滥用的例子。 nav元素的规范描述如下: n…

    2018年2月3日
    6.8K0
  • 第11课:表格的高级特性

    表格还有哪些相关属性? colspan和rowspan这两个属性用于创建特殊的表格。colspan是“column span(跨列)”的缩写。colspan属性用在<td>标签中,用来指定单元格横向跨越的列数: 例1: <table border=”1″> <tr><td colspan=”3″>单元格1&lt…

    2018年1月19日
    7.4K0
  • CSS图形绘制练习-最常见的40种形状和图形源码分享

    CSS图形绘制练习-最常见的40种形状和图形源码分享CSS图形绘制练习-最常见的40种形状和图形源码分享CSS图形绘制练习-最常见的40种形状和图形源码分享CSS图形绘制练习-最常见的40种形状和图形源码分享

     CSS3可以实现很多漂亮的图形,本文从互联网收集了最常见的40种形状和图形,现分享给大家。 包括圆形,椭圆形,三角形,倒三角形,左三角形,右三角形,菱形,梯形,长方形,正方形,圆环,平行四边形,五角星,六角星,五边形,六边形,八边形,心形,蛋形,无穷符号,消息提示框,钻石,八卦图,食豆人,扇形,月牙,顶左直角三角形,顶右直角三角形 ,底左直角三角形 ,底右…

    2020年2月22日 网页制作
    15.3K0

发表回复

登录后才能评论