CSS页面布局及样式设计实验报告（材料）_css页面布局实例
CSS页面布局及样式设计实验报告（材料）由刀豆文库小编整理，希望给你工作、学习、生活带来方便，猜你可能喜欢“css页面布局实例”。
实 验 报 告
实验项目名称： CSS页面布局及样式设计
（所属课程： web系统与技术）
学 院：计算机学院 专业班级：11级计科信息 姓 名： 学 号： 实验日期： 实验地点：A06-404 合作者： 指导教师：李
本实验项目成绩： 教师签字： 日期：
一、实验目的（1）掌握CSS中的定位属性使用方法。（2）掌握DIV+CSS的页面布局方式。（3）掌握CSS中的常用属性的使用方法。（4）理解CSS的样式构造。
二、实验条件
安装Web开发环境的微机。
三、实验内容
（1）重新对聊天室的注册页面、登陆页面和聊天页面进行页面布局。（1）对聊天室的注册页面、登陆页面和聊天页面进行样式设计。
四、实验步骤
（1）注册页面使用CSS将注册表单居中显示，表单内嵌入表格将文本与输入域格式化显示，表单内使用label标签。
（2）登录页面中添加div层用于显示在线用户数。
（3）登录页面使用div将登录表单，在线用户数，logo图片，超链接等页面元素重新定位布局。
（4）聊天页面改用div标签并使用CSS的position定位属性进行布局，框架内的独立页面使用float属性进行布局。
（5）使用CSS设置三个页面的背景颜色或背景图片。（6）注册页面使用CSS设计所有输入框和提交按钮的样式。
（7）登录页面使用CSS设置的超链接的字体和下划线、登录表单使用圆顶角、在线用户数使用图片数字，使用CSS设计登录按钮的显示样式。
第1页
共8页 实 验 报 告
（8）聊天页面中使用CSS设计信息发送表单和发送按钮的样式，设计用户信息列表和聊天信息段落的的显示样式。
五、实验结果
注册界面效果图及代码：
//总体框架 //添加图片代码 
JavaScript教案长沙飞迅学术部: 傅志能第四章CSS样式特效本章工作任务: 制作改变边框样式、按钮图片样式的特效 制作51job弹出层效果 制作“点卡”图片切换效果本章技能目......
字体属性：(font) 大小 {font-size: x-large;}(特大) xx-small;(极小) 一般中文用不到，只要用数值就可以，单位：PX、PD 样式 {font-style: oblique;}(偏斜体) italic;(斜体) norma......
单元4——使用框架布局页面学习目标： 理解框架布局的原理 掌握使用框架进行页面布局的方法 学习利用浮动框架嵌入插件 Dreamweaver CS3提供了一种很方便的可以进行网页布局......
《操作系统--页面置换算法》 实验报告姓名： 范学升学号：1001050903班级：电科10-1班专业：电子信息科学与技术一、实验目的1．通过模拟实现几种基本页面置换的算法，了解虚拟存储技术......
计算机体系结构实验报告班级：计科姓名：张华敏学号：0902班0909090814 FIFU算法一， 实验内容：编写一段程序来模拟页面置换算法中的FIFU算法的实现 二， 算法设计：设置一个产生随机数......
