[PPT模板]CSS+DIV.ppt

CSS + DIV 马远志 CSS的概念 CSS (Cascading Style Sheet)，中文翻译为层叠样式表，是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。 标记的概念 HTML的缺陷 CSS的引入 标记的概念 body h2CSS标记/h2 pCSS标记的正文内容从这里开始/p /body HTML的缺陷 CSS的引入 head style h2{ font-family:幼圆; color:#FF0000; } body{ background-color:#f8ffd3; margin:0px; padding:0px; } /style /head 使用CSS控制页面 行内样式 内嵌式 链接式 导入样式 行内样式 内嵌式 head title页面标题/title style type=text/css p{ color:#FF00FF; text-decoration:underline; font-weight:bold; font-size:25px; } /style /head 链接式 head title页面标题/title link href=1.css type=text/css rel=stylesheet /head 导入样式 head title页面标题/title style type=text/css @import url(1.css); /style /head CSS基本语法 CSS选择器 选择器的声明 CSS的继承 CSS选择器 标记选择器 类别选择器 ID选择器 CSS选择器----标记选择器 CSS选择器----类别选择器 CSS选择器----类别选择器 CSS选择器---- ID选择器 CSS选择器---- ID选择器 选择器的声明 CSS的继承 CSS的继承 作业 作业的讲解 CSS文字效果 CSS文字样式 文字实例：模拟Goolge公司logo CSS段落文字 段落实例：百度有哪些信誉好的足球投注网站 CSS文字样式 字体名称属性(font-family) 这个属性设定字体名称，如Arial, 黑体, 宋体等。例句如下： .s1 {font-family:Arial;} 字体大小属性(font-size) 这个属性可以设置字体的大小。字体大小的设置可以有多种方式，最常用的就是pt和px。例句如下： .s2 {font-size:16px;} 字体风格属性(font-style) 这个属性有三个值可选：normal, italic, oblique。normal是缺省值，italic, oblique都是斜体显示。例句如下： .s1 {font-sytle:italic;} 字体加粗属性(font-weight) 这个属性常用值是normal和bold，normal是缺省值。例句如下： p style = font-weight:bold;这段文字字体的浓淡属性(font-weight)值是bold。p CSS文字样式 字体变量属性(font-variant) 小写字母转化为大写字母 这个属性有两个值，normal和small-caps，normal是缺省值。small-caps表示小的大写字体。例句如下： ?.s1 {font-variant:small-caps;} text-transform: 字体复合属性(font) 这个属性是各种字体属性的一种快捷的综合写法。这个属性可以综合字体风格属性(font-style)，字体变量属性(font-variant)，字体浓淡属性(font-weight)，字体大小属性(font-size)等属性。例句如下： .s1 {font:italic normal bold 11px arial;} 字体颜色(color) 字体颜色用CSS中的color属性来表示 下划线、顶划线、删除线 text-decoration: 文字实例：模拟Goolge公司logo CSS段落文字 文本对齐属性(text-align) 这个属性用来设定文本的对齐方式。有以下值： left (居左，缺省值) right (居右) center (居中) justify (两端对齐) 示例代码如下： .p2 {text-align:right;} 文本修饰属性(text-decoration) 这个属性主要设定文本划线的属性。有以下值： none (无，缺省值) underline?(下划线) overline (上划线) line-through (当中划线) 示例代码如下： .p2 {text-decoration: underline;} CS