CSS简介文字效果和排版

《CSS简介文字效果和排版》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第4章CSS简介，文字效果及排版本章目标了解CSS的概念和基本语法使用CSS修饰文字，并进行排版本节教学内容CSS基本概念CSS基本语法CSS文字效果CSS排版样式什么是CSSCSS(CascadingStyleSheet),中文译为层叠样式表，它是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。CSS1996年通过W3C审核认证，并推荐使用。CSS是网页设计的一个突破，它解决了网页界面排版的难题。HTML的Tag主要是定义网页的内容(Content)，而CSS决定这些网页内容如何显示(Layout)。例：如一张桌子的长120cm，宽60c

2、m，套用css的格式为，桌子{长:120cm;宽:60cm;}4为什么需要CSS样式表HTML标签的外观样式比较单一颜色只有黑白字体类型和大小无变化样式表的作用相当于华丽的衣服内容相同外观不同7/25/20215使用传统的HTML进行设计传统的html中控制网页布局样式很麻烦，例如下面的例子。倘若引入：CSS对其中的信息进行控制网页布局将会事半功倍。为什么需要CSS样式表样式表能实现内容与样式的分离，方便团队开发程序员写代码美工做样式内容与样式和谐统一的完整网页7/25/20217本节教学内容CSS基本概念CSS基本语法CSS文字效果CSS排版样式样式表的

3、基本语法样式表的基本结构p{color:red;font-size:30px;font-family:隶书;}……声明文档样式表结束文档样式表开始，类型为CSS样式样式规则选择器样式规则p{color:red;font-size:30px;font-family:隶书;}属性属性的值7/25/20219样式表的基本语法通常情况下，CSS的描述部分是由三部分组成的，分别是选择器、属性和属性值。写法如下：选择器{属性:属性值;}例如：h1{font-size:12px;}本例中选择器也就是你想要描述的

4、HTML标签，其它选择器将在后面的教程中讲解。上面例子的选择器就是h1标签。属性和属性值则是说明你想要描述h1的哪一个属性，该属性的值为多少，例如上面例子中将h1字体大小属性为12像素，写成font-size:12px。属性和属性值之间用一个冒号“:”分开，以一个分号“;”结束，最后别忘记用一对大括号“{}”括起来。7/25/2021CSS选择器CSS选择器共有三种：标签选择器、ID选择器、类选择器。类选择器此处为p标签内的文字

5、ID选择器此处为p标签内的文字

此处为p标签内的文字

6、id#CCC;}#menuul和#menuulli即为派生选择器，如果我们把前边的#menu去掉，那么将是对ul标签重定义，重定义的属性将应用到全局，而前边加上#menu后，将是定义ID为menu元素内ul的样式，设置它的样式只对#menu下的ul生效，不对它之后的ul生效。CSS派生选择器h1,h2,h3,h4,h5,h6{color:green;}p,div,span{font-size:20px;}可以对选择器进行分组，这样，被分组的选择器就可以分享相同的声明。用逗号将需要分组的选择器分开。在下面的例子中，我们对所有的标题元素进行了分组。所有的标题元

7、素都是绿色的，p段落、div分区、span都是20像素字体。CSS选择器分组13样式表的基本语法-举例p{color:red;font-family:"隶书";font-size:24px;}

静夜思

床前明月光，

疑是地上霜。

我是郭德刚，

低头思故乡。

8、统一用分号隔开选择器如何编写此样式?字体类型为律书、大小24px7