信息管理学院刘政敏******@Page 2本章主要内容1、CSS概述2、CSS基础语法3、CSS选择器4、CSS主要属性5、CSS核心机制-盒子模型6、CSS重点和难点-定位7、综合示例8、CSS注意事项、技巧Page 3一、CSS概述1、什么是CSS?CSS:层叠样式表(Cascading Style Sheet ),定义了如何显示HTML元素,用来控制网页的样式和布局。<html><head><title> Hello! </title></head><body><h2>通过样式表来改变网页外表</h2><p>欢迎来到CSS世界</p><p>css给我们带来丰富多彩的世界</p></body></html>Demo1 未设计CSS的页面Page 4不用CSS,如何修改各标签的样式?使用诸如<font>,<b>等修饰性标签标签自身属性未使用CSS的页面Page 6<head><style type="text/css">h2{color:red;font-size:46px;font-family:宋体}#p1{text-indent:10px;background:blue;font-family:黑体}p{text-indent:20px;background:green;font-family:黑体}</style></head><body><h2>通过样式表来改变网页外表</h2><p id="p1">欢迎来到CSS世界</p><p>css给我们带来丰富多彩的世界</p></body>Demo1 带有CSS的页面Page 7Page 8 2、CSS作用第一,简化网页的代码,提高访问速度外部的CSS文件会被浏览器保存在缓存里,加快下载显示的速度,也减少了需要上传的代码数量。第二,便于维护(1)便于修改网站样式:只要修改css文件,就可改变整个网站的风格特色。避免一个个网页的修改,大大减少重复劳动的工作量;(2)可以重用样式;第三,功能更强大;第四,页面内容和显示样式分离Page 9山经网站的CSS文件Page 10二、CSS基础语法1、CSS基础语法由三部分组成:选择器、属性和值selector { property: value }selector:选择器,希望定义样式的HTML标签;property:相应标签的属性;value:属性值;例如:p { color: #ff0000;font-size:12px }
CSS简介 来自淘豆网m.daumloan.com转载请标明出处.