网页设计与制作DIV+CSS.pptx

网页设计与制作DIV+CSS.pptx

ID:62122211

大小:328.37 KB

页数:44页

时间:2021-04-15

网页设计与制作DIV+CSS.pptx_第1页
网页设计与制作DIV+CSS.pptx_第2页
网页设计与制作DIV+CSS.pptx_第3页
网页设计与制作DIV+CSS.pptx_第4页
网页设计与制作DIV+CSS.pptx_第5页
资源描述:

《网页设计与制作DIV+CSS.pptx》由会员上传分享,免费在线阅读,更多相关内容在教育资源-天天文库

1、网页设计与制作DIV+CSS2017.3.1Div+css的概述业界对DIV+CSS的标准化设计关注DIV+CSS标准化的影响下,网页设计人员已经把这一要求作为行业标准传统的网页布局是使用网格DIV+CSS布局DIV+CSS布局 这个布局中,div承载的是内容,而css承载的是样式。内容和样式的分离对于所见即所得的传统TABLE编辑方式确实是一个很大的冲击,尤其是设计人员很难接受设计一个他们不能立即看到的样式。不过随着学习,会发现div+css的好处实在是太明显了DIV的概念1.DIV全称division意为“区分”使用DIV的方法跟使用其他tag的方法一样。2.如果单独使用DI

2、V而不加任何CSS,那么它在网页中的效果和使用

是一样的。3.DIV本身就是容器性质的,你不但可以内嵌table还可以内嵌文本和其它的HTML代码4.注意:
标签可以用来组合其它的HTML元素,但不能嵌套在段落元素中,例如,

aa

bb
cc

的结果是不确定的。SPAN和DIV的区别SPAN和DIV的区别在于,DIV(division)是一个块级元素,可以包含段落、标题、表格,乃至诸如章节、摘要和备注等。是行级容器标签,不可以包含图片、标题、段落等,只能包含文字内容而SPAN是行内元素,SPAN的前后是不会换行的,它没有

3、结构的意义,纯粹是应用样式,当其他行内元素都不合适时,可以使用SPAN。Css的概念CSS:CascadingStyleSheets层叠式样式表HTML语言并不是真正的版面语言,它只是标记语言,意图把文档的不同部分通过它们的功能作用进行分类,但并不指出这些元素如何在计算机屏幕上显示。CSS则提供对文档外观的更好更全面的控制,而且不干扰文档的内容。CSS基本语句的结构:HTML选择符{属性1:值1;属性2:值2;属性n:值n;}选择符是要对它应用说明的HTML元素名称;属性就是能够被CSS影响的浏览器行为,如字体、背景、边界等;值就是可以为属性设置的任何选项,如“楷体”,“red”

4、等。如:p{font-size:12pt;color:blue}盒子模型每个HTML元素都可以看作一个装了东西的盒子,盒子具有宽度(width)和高度(height),盒子里面的内容到盒子的边框之间的距离即填充(padding),盒子本身有边框(border),而盒子边框外和其他盒子之间,还有边界(margin)。边缘margin(边界)(margin-top、margin-right、margin-bottom、margin-left):外边距顺序依次是上、右、下、左例如,{margin:2em4em}、{margin-left:-200px}padding(填充)(paddi

5、ng-top、padding-right、padding-bottom、padding-left):内边距指文本边框与文本之间的距离,顺序依次是上、右、下、左布局中的主要样式fontline-heightcolormarginpaddingbordertext-alignbackgroundwidth:heightfloat:cleardisplay如何在网页中应用css1.行内套用(两种)如:1)2)直接写在标签内

6、:隶书;font-weight:bold;font-size:24px">2.外部连接套用如:如何在网页中应用css3.汇入套用(汇入的做法为利用@import这个指令)使用@import导入,语法:文档标题

7、head>内嵌样式的选择器根据选择器的不同,内嵌样式又分为:HTML选择器CLASS类选择器ID选择器虚类和虚元素selector{property1:value1;property2:value2;…}需要应用的样式的内容样式的属性样式的属性的值HTML选择器P{/*设置样式:字体和背景色*/font-family:System;font-size:18px;color:#3333CC;}H2{background-col

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。