MVC第3章CSS样式(2学时)pdf.doc

.NET架构 主讲教师 张智 计算机学院 .NET架构 第3章 CSS样式 样式是对 HTML 元素的一种格式化。 三种方法定义： 内联样式 -- 在元素的style属性中定义 (局部) 内部样式 -- 通过 style 标签定义 (页面级) 外部样式 -- 在css文件中定义 (可被多个页面调用) 便于修改和维护 ? 样式综合示例 .NET架构 1. 内联样式示例 学号: input type=text style=color:red; font-size:30px/ br/ 文字颜色 文字大小 姓名: input type=text style=background-color:yellow; font-size:12pt/ br/ 背景色 年龄: input type=text style=width:40px; font-size:1.2em/ 元素宽度 px：像素点，最小单位； pt：磅，一般9pt=12px。 em：百分比值(比例值) 【返回】 .NET架构 2. 内部样式示例1 -- 标签级 head style type=text/css body { background-color:silver } input { background-color:yellow; font-size: 12px } /style /head body 所有input都将使用同一样式 学号: input type=text / br/ 姓名: input type=text /br/ 年龄: input type=text /br/ /body .NET架构 内部样式示例2 -- id或class级 head style 背景图 body { background: url(/pic/bg.jpg) no-repeat; } #号前缀 #xh { background-color:yellow; font-size: 12px } 点号前缀 .xm { -color:red; font-size: 16px } /style /head class属性调用 id属性调用 body 学号: input id=xh/br/ 姓名: input type=text class=xm/br/ 年龄: input type=text /br/ /body