第9章网页的布局综合练习
- 格式:ppt
- 大小:1.41 MB
- 文档页数:33
第9章使用AP Div布局页面一、填空题1、通过设置AP Div的()属性可以使多个AP Div发生堆叠,也就是多重叠加的效果。
正确答案:z轴2、如果要选定多个AP Div,只要按住()键不放,在【AP元素】面板中逐个单击AP Div的名称即可。
正确答案:Shift3、在【CSS规则定义】对话框的【定位】分类中,将【类型】选项设置为“()”,即表示AP Div,否则即为Div标签,这是AP Div与Div标签转换的关键因素。
正确答案:绝对4、可以按住()键,在【AP元素】面板中将某一个AP Div拖曳到另一个AP Div上面,形成嵌套AP Div。
正确答案:Ctrl二、选择题1、下面关于创建AP Div的说法错误的有()。
A、选择菜单栏中的【插入记录】/【布局对象】/【AP Div】命令B、将【插入】/【布局】面板上的(绘制AP Div)按钮拖曳到文档窗口C、在【插入】/【布局】面板中单击(绘制AP Div)按钮,然后在文档窗口中按住鼠标左键并拖曳D、在【插入】/【布局】面板中单击(绘制AP Div)按钮,然后按住Shift键不放,按住鼠标左键并拖曳正确答案:D2、关于【AP元素】面板的说法错误的有()。
A、双击AP Div的名称,可以对AP Div进行重命名B、单击AP Div后面的数字可以修改AP Div的z轴顺序C、勾选【防止重叠】复选框可以禁止AP Div重叠D、在AP Div的名称前面有一个眼睛图标,单击眼睛图标可锁定AP Div正确答案:D3、关于选定AP Div的说法错误的有()。
A、单击文档中的图标来选定层B、将光标置于AP Div内,然后在文档窗口底边标签条中选择“<div>”标签C、单击AP Div的边框线D、如果要选定两个以上的AP Div,只要按住Alt键,然后逐个单击AP Div手柄或在【AP元素】面板中逐个单击AP Div的名称即可正确答案:D4、关于移动AP Div的说法错误的有()。
网页设计与开发第9章试卷答案试题A(或B)参考答案及评分标准一、填空题(每小题1分,共20 分)1、B2、D3、A4、C5、D6、D7、C8、A9、C 10、C11、B 12、B 13、C 14、A 15、D16、A 17、B 18、B 19、D 20、D二、选择题(每小题 2 分,共20分)1、href type2、color font-size3、id header4、选择符(selector)声明(declaration)5、<link>6、逗号7、font-family8、斜体font-style9、letter-spacing10、十六进制数RGB函数(整数)RGB函数(百分比)颜色名称三、简单题(每小题6分,共30分)1、 <!DOCTYPE> 声明位于文档中的最前面的位置,处于<html> 标签之前。
此标签可告知浏览器文档使用哪种HTML 或XHTML 规范。
(重点:告诉浏览器按照何种规范解析页面)2、改版的时候更方便只要改css文件。
页面加载速度更快、结构化清晰、页面显示简洁。
表现与结构相分离。
易于优化(seo)搜索引擎更友好,排名更容易靠前。
3、最基本的:设置display属性为none,或者设置visibility属性为hidden技巧性:设置宽高为0,设置透明度为0,设置z-index位置在-10004、块级元素(block)特性:总是独占一行,表现为另起一行开始,而且其后的元素也必须另起一行显示;宽度(width)、高度(height)、内边距(padding)和外边距(margin)都可控制;内联元素(inline)特性:和相邻的内联元素在同一行;宽度(width)、高度(height)、内边距的top/bottom(padding-top/padding-bottom)和外边距的top/bottom(margin-top/margin-bottom)都不可改变(也就是padding和margin的left和right是可以设置的),就是里面文字或图片的大小。
⽹页设计与制作(附微课视频第2版)参考答案第⼀章习题参考答案⼀、选择题1、A2、A3、B4、C5、A、B、C、D6、A、C、D7、B8、C9、B⼆、简答题1.答:URL是UniformResourceLocation的缩写,译为“统⼀资源定位符”,URL是Internet 上⽤来描述信息资源的字符串,主要⽤在各种WWW客户程序和服务器程序上,特别是著名的Mosaic。
采⽤URL可以⽤⼀种统⼀的格式来描述各种信息资源,包括⽂件、服务器的地址和⽬录等;2答:⽂本、图像、动画、视频等。
3.答:⽹页结构语⾔的作⽤是将⽹页需要的内容以结构化、模块化的⽅式总结和存储,供表现语⾔和⾏为进⾏调⽤。
⽹页结构语⾔包括可扩展超⽂本标记语⾔XHTML 1.0和HTML 5等两种结构语⾔。
其中,XHTML 1.0为当前被⼴泛使⽤的标准,⽽HTML 5标准则是⽹页未来将被使⽤的标准。
⽹页表现语⾔的作⽤是为⽹页的结构语⾔定义尺⼨、位置、背景,以及⽂本的各种效果。
⽬前⽹页表现的国际标准语⾔为CSS 样式表技术。
⽹页结构语⾔和⽹页表现语⾔共同作⽤可以为⽤户呈现⽹页的整体画⾯,然⽽,⽹页是⼀种交互性的媒体,其除了可以呈现内容外,还可以根据⽤户的界⾯操作响应各种事件,此时,就需要⽤到⽹页的⾏为语⾔。
⽹页的⾏为语⾔包括多种类型,例如,JavaScript、JScript以及VBScript等。
4.答:⼀个完整的HTML5⽂档包含声明、头部和主体三个部分组成。
第⼆章习题参考答案⼀、选择题1.A、B2.A3.B4.D5.D6.D7.C⼆、简答题1.答:(⼀)⽹站功能需求分析;(⼆)⽹站的策划,本阶段主要包含⽹站栏⽬,内容,产品提炼等等;(三)⽹站设计,根据策划开始进⾏设计;(四)程序代码的开发;(五)上线测试;(5)后期维护;2.答:(1)对称与均衡对称分为左右对称、上下对称、重复对称、旋转对称等形式。
对称的造型在⼤⾃然中⽐⽐皆是,同时也是版式设计常⽤的构成形式。
《网页设计与开发第9章》试卷一、选择题1. CSS 指的是( ).puter Style SheetsB.Cascading Style SheetsC.Creative Style SheetsD.Colorful Style Sheets答案:2. 如何改变元素字体?( ).A.font=B.f:C.font-familyD.font-family:答案:3. br标签在XHTML中语意为( )A.换行B.强调C.段落D.标题答案:4. 在CSS语言中下列哪一项是"左边框"的语法?( )A.border-left-width: <值>B.border-top-width: <值>C.border-left: <值>D.border-top-width: <值>答案:5. 在 HTML 文档中,引用外部样式表的正确位置是( ).A.文档的末尾B.文档的顶部C.<body> 部分D. <head> 部分答案:6. 如何去掉文本超链接的下划线?( ).A.a {text-decoration:no underline}B.a {underline:none}C.a {decoration:no underline}D.a {text-decoration:none}答案:7. 下面()是ID的样式规则定义( ).A.TR{clore:red;font-family:"隶书";font-size:24px;}B.H2{color:red;font-family:"隶书";}C.#grass{color:green;font- family:"隶书"; font-size:24px;} D.P{background-color:#CCFF33;text-align:left;}答案:8. 哪个 HTML 标签用于定义内部样式表:( ).A.<style>B.<script>C.<css>D.<link>答案:9. 下列哪个选项的 CSS 语法是正确的?( )A.body:color=blackB.{body:color=black(body}C.body {color: black}D.{body;color:black}答案:10. 如何在 CSS 文件中插入注释( )A.// this is a commentB.// this is a comment //C./* this is a comment */D.' this is a comment’答案:11. 哪个属性可用于改变背景颜色?( ).A.bgcolor:B.background-color:C.color:D.background答案:12. 如何为所有的 <h1> 元素添加背景颜色?( ).A.h1.all {background-color:#FFFFFFB.h1 {background-color:#FFFFFF}C.all.h1 {background-color:#FFFFFF}D.h1 {bgcolor:#FFFFFF}答案:13. 如何改变某个元素的文本颜色?( )A.text-color:B.fgcolor:C.color:D.text-color=答案:14. 哪个 CSS 属性可控制文本的尺寸?( )A.font-sizeB.text-styleC.font-styleD.text-size答案:15. CSS样式表不可能实现( )功能。
网页设计练习题集
1. 设计一个简单的登录界面(100 字以上)
要求:
- 包含用户名和密码输入框
- 提供登录按钮
- 界面布局简洁明了
- 适配不同屏幕尺寸
2. 设计一个博客列表页面(100 字以上)
要求:
- 显示博客的标题、作者和发布日期
- 提供博客预览的摘要或首段
- 使用合适的分页方式展示博客列表
- 具有响应式设计,能够在不同设备上正常浏览
3. 设计一个电子商务产品详情页面(100 字以上)
要求:
- 显示产品的名称、价格和主要特点
- 提供产品的图片展示
- 显示产品的详细描述
- 包含用户评价和评分功能
4. 设计一个网页版的音乐播放器(100 字以上)
要求:
- 显示歌曲的名称、歌手和专辑信息
- 提供播放、暂停、上一首和下一首等基本控制功能
- 支持歌曲的进度拖拽和音量调节
- 可以显示歌词,并跟随歌曲播放进行滚动
5. 设计一个在线购物平台的结算页面(100 字以上)
要求:
- 显示购物车中的商品清单和总价
- 提供填写配送信息的表单
- 具有不同支付方式的选择
- 提供确认购买按钮,完成订单生成
6. 设计一个个人主页(100 字以上)
要求:
- 显示个人头像和基本信息
- 包含个人技能和项目经历的展示
- 可以自定义主题和布局
7. 设计一个在线论坛的帖子详情页面(100 字以上)
要求:
- 显示帖子的标题、作者和发布时间
- 提供帖子内容的展示
- 具有回帖和点赞功能
- 可以查看评论和回复
以上是网页设计练习题集,希望能够帮到你!如果有任何问题,请随时与我联系。
网页设计习题与答案一、单选题(共30题,每题1分,共30分)1、<'div>标记是网页布局中最常用的标记,其显示类型为()。
A、浮动类型B、块级类型C、行内类型D、行内块类型正确答案:B2、关于盒子模型中的宽度和高度属性,下面说法正确的是()。
A、盒子模型中的宽度和高度属性适用于所有元素B、盒子模型中的宽度和高度属性仅适用于行内元素C、盒子模型中的宽度和高度属性仅适用于块级元素D、以上说法都正确正确答案:C3、下列标记中,用来设置文本为粗体的是()。
A、<'strong><'/strong>B、<'del><'/del>C、<'em><'/em>D、<'u><'/u>正确答案:A4、下列选项中哪个表示有序列表?()A、<'li><'/li>B、<'dd><'/dd>C、<'ol><'/ol>D、<'ul><'/ul>正确答案:C5、在网页中插入图像,若图像文件位于html文件的上两级文件夹,则在文件名之前加入()。
A、../../B、/C、./D、../正确答案:A6、使用标签指定式选择器,让段落应用class名为test的类,下列写法正确的是()。
A、p.test{color:red;}B、p .test{color:red;}C、p#test{color:red;}D、p,test{color:red;}正确答案:A7、定义列表常用于对术语或名词进行解释和描述,用一对()标记定义。
A、<'dl><'dl>B、<'ul><'/ul>C、<'dt><'/dt>D、<'ol><'/ol>正确答案:A8、位于HTML文档的最前面,用于向浏览器说明当前文档使用哪种 HTML 或 XHTML 标准规范的标记是()。
(word完整版)网页制作综合练习题网页制作综合练习题一、单选题1、要制作网页就要使用网页制作工具如A FrontPage2003B ExcelC WordD PowerPoint3、在FrontPage窗口中单击“文件”菜单中的选项可以建立新网页。
A打开 B保存 C新建 D关闭4、在FrontPage窗口中选中“个人简介”单击“插入”菜单中的选项可以建立超链接。
A组件 B超链接 C图片 D书签5、如果网页中的文字内容比较多为了搜索段落方便可以插入A。
图片 B。
文字C.动画 D。
书签6、文字建立链接后通常在文件下方会产生A. 波浪线B.下划线 C。
圆圈D。
以上都不正确7、网页中可以插入A.图片B.动画 C。
音乐 D。
以上都可以9、在FrontPage 2003中一般常用的动画文件格式有格式A。
FlashB。
gif C。
Flash和gif D. jpg11、在网页中插入背景音乐单击“文件”菜单中的命令A。
属性 B.新建C。
背景 D。
音乐12、是WWW的灵魂A.文字B.图片 C。
动画D。
超级链接13、插入FLASH动画是选择“插入”菜单中的选项A.高级 B。
图片 C.表格 D。
动画(word完整版)网页制作综合练习题A.常规 B.背景 C.边距D。
数据源15、在网页中可以建立超级链接A。
文字 B.图片 C.电子邮件 D.文字、图片、电子邮件16、“超链接”在菜单中A。
文件B.编辑 C。
插入 D.工具17、“视频”命令在“插入”菜单中的选项中A.图片B.表格C.超连接D.书签18、Frontpage 2003中如果要将图片放在页面的任意位置使用方法A。
图层移动 B.对齐方式 C。
绝对定位 D。
相对定位19、在Frontpage 2003中我们可以使用下列方法进行页面布局使图文整齐有序的放在想要的位置上A.表格B.书签C.表单 D。
单元格20、在FrontPage中,”打开站点"是指A新建一个站点文件夹 B打开一个网页文件C打开一个站点文件夹 D新建一个网页文件夹21、下面哪个是超文本标记语言的简称A 、Web PageB、HTMLC、WWW D、http22、浏览器是用于浏览网页的软件下列选项中属于浏览器软件的是()A FrontPage2003B IEC WordD Outlook Express23、浏览网页过程中鼠标移动到超级链接上时其形状一般为A I形 B小箭头形 C小手形 D沙漏形24、首页的文件名一般为。
第9章综合实例──使用框架布局网页“柠檬网”在学习了框架的相关知识后,本例通过制作一个使用框架技术制作的播客网站来学习其在实际网页制作中的应用。
该网页由上下框架组成,当单击上方框架导航栏中的链接时,将在下方框架中显示链接的网页文档,如图9-2-1所示。
图9-2-1 使用框架布局网页最终效果制作思路为简化制作过程,我们已将各个框架中需要用到的源文件准备好。
首先创建框架页,并在各框架中设置素材中提供的网页源文件,最后设置超链接,完成网页制作。
制作步骤1.制作网站首页网站首页的制作主要就是创建框架页,并为各个框架设置源文件,下面我们来看具体操作。
Step01 在本地磁盘新建文件夹“lemon”,然后将素材中的“lemon”文件夹中的相关文件拷贝至本地“lemon”文件夹中,并在Dreamweaver中定义站点“lemon”。
Step02 新建一个普通文档,将插入点置于文档编辑窗口中,然后单击“布局”插入栏中的“框架”按钮,在下拉列表中选择“顶部框架”,如图9-2-2所示。
图9-2-2 插入顶部框架Step03选择“文件”→“保存框架页”菜单,将框架页保存为“index.html”。
Step04单击上下框架分界线,在“属性”面板上“行”编辑框中输入110,设置上方框架高为110像素,如图9-2-3所示。
图9-2-3 设置框架大小Step05按住【Alt】键的同时在顶部框架内单击,以选择顶部框架。
然后单击“属性”面板上“源文件”编辑框后的“浏览文件”按钮,如图9-2-4所示。
图9-2-4 选择框架后单击“浏览文件”按钮Step06打开“选择HTML文件”对话框,在“查找范围”下拉列表中选择网站根文件夹,在文件列表中选择网页文档“top.html”,然后单击“确定”按钮,如图9-2-5所示。
图9-2-5 选择源文件Step07按照同样的方法,设置下方框架源文件为“main.html”,此时将弹出提示框,单击“否”按钮即可,如图9-2-6所示。