欢迎来到天天文库
浏览记录
ID:44992025
大小:586.00 KB
页数:32页
时间:2019-11-06
《网站设计——CSS的应用方式和盒子模型》由会员上传分享,免费在线阅读,更多相关内容在行业资料-天天文库。
1、第六章CSS的应用方式和盒子模型回顾CSS的样式规则中,定义背景颜色的属性是什么?CSS的样式规则中,定义文本居中的属性是什么?提问本章案例熟练使用盒子模型相关属性,改变HTML元素的样式和定位。案例演示本章目标CSS的三种应用方式理解盒子模型学会使用div和span预习检查CSS的应用方式有哪三种?描述盒子模型的外边界属性是什么?Div元素是块元素还是内联元素?提问CSS的三类应用方式外部样式表行内样式表内部样式表内部样式表在
2、CSS重复率较高,以后维护起来不方便。内部样式表外部样式表把样式表写在一个以.css为后缀的CSS文件里。有了单独的CSS文件,HTML文档如何引用这个文件呢?演示:外部样式表
3、把样式定义在元素的标签里。
4、标签内使用sytle属性声明仅对本标签有效,偶尔用用也可以。样式表的“最近原则”p{font-size:18px;color:#ff0000;}……您可以通过“我的……您可以点击“申请加入”按钮提交申请。
5、式表、内部样式表更换位置,结果又怎样?课堂练习使用外部样式表,实现网页
6、Margin-topMargin-bottom盒子模型的属性名称CSS属性边界盒子的上边界Margin-top盒子的右边界Margin-right盒子的下边界Margin-bottom盒子的左边界Margin-left填充内容与盒子上边框之间的距离Padding-top内容与盒子右边框之间的距离Padding-right内容与盒子下边框之间的距离Padding-bottom内容与盒子左边框之间的距离Padding-left盒子模型的属性名称CSS属性边框盒子的上、右、下、左边框的样式Border-top-styleBorder-rig
7、ht-styleBorder-bottom-styleBorder-left-style盒子的上、右、下、左边框的宽度Border-top-widthBorder-right-widthBorder-bottom-widthBorder-left-width盒子的上、右、下、左边框的颜色Border-top-colorBorder-right-colorBorder-bottom-colorBorder-left-color宽度盒子的宽度Width高度盒子的高度Height盒子模型示例效果左填充40px左边界50px上边界50px示例
8、中使用盒子模型的哪些属性?提问绿色虚线边框盒子模型的参考代码p{font-size:14px;color:#0000ff;text-indent:2em;margin-top:
此文档下载收益归作者所有