web前端开发技术期末复习 储久良课后答案
HTML是一种超文本标记语言，html文档是由标记构成的文本文件
世界上第一个网页是http://info.cern.ch
访问FTP站点使用的协议类型是 FTP
设计JavaScript语言的公司的Netscape
世界上第一个网站发明人是Tim Berners-Lee（蒂姆·伯纳斯·李）
IE浏览器菜单中 ，选择查看命令，可以在记事本中查看网页源代码
常用的WEB前端开发工具NotePad、EditPlus、TextPad、TopStyle、UltraEdit ，Dreamweaver、HBuilder、Visual Studio Code、Sublime Text、WebStorm、Eclipse、Editplus、Aptana、Notepad++、BrowserSync以及Vim
URL的全称是统一资源定位符，CSS的全称是层叠样式表（级联样式表），AJAX的全称是异步JavaScript和XML
常用的主流网络浏览器 IE、Firefox、Chrome、opera、UCWEB、Edge
WEB的工作原理
Web一般是B/S(Browser/server)架构，是一个客户/服务器系统它由分布在Internet上成千上万个Web服务器和Web浏览器构成.浏览器是为用户查阅Web牙的信息而在本机上运行一个程序，客户端用Web浏览器获取Web服务上所需的信息.Web服务器提供用HTML语言编写的超文本信息，存储和管理超文本文档和超文本连接，并响应Web浏览器的连接请求.当服务器与某个浏览器建立连接后，监听浏览器发来的请求，并向浏览器传送所需要的信息，这些信息可以是从服务器的磁盘上取得的，也可以是临时拼凑起来的.
WEB具有哪些特点？
1、易导航和图形化的界面
Web很流行，他可以在同一页同时显示色彩和文本，而在之前的Internet只能显示文本信息。同时浏览很方便，只需要从一个链接跳转到另外一个链接即可。
2、与平台无关性
无论计算机系统是什么平台，都可以通过Internet访问WWW，没有平台的限制。
3、分布式结构
大量的图片、音频、视频信息会占用很多的磁盘空间，事先难以预料信息的多少，对于Web来说信息可以放在不同的站点，而没有必要集中在一起。浏览的时候只需要在浏览器指向该站点即可。也就是实现了物理上不一定在一个站点的信息逻辑上是一体的。
4、动态性
站点的信息是可以更新的，如果能保证实时性，则实现了动态性。
5、交互性
Web的交互性首先体现在其超链接上，用户的浏览顺序完全由其自己决定。另外通过表达Form的形式可以从服务器获取动态的信息。用户向服务器提交申请，服务器根据用户请求返回响应信息。
写出URL的格式,并说明其组成及作用
统一资源定位符(Uniform Resource Locator,URL)也被称为网页地址,如同在网络上的门牌,是因特网上标准的资源的地址(Address)。 协议类型://服务器地址(端口号)/路径/文件名 例如: http://www.edu.cn/kexuetansuo_12385/index.shtml 协议类型为协议http (超文本传输协议资源), www.edu.cn为域名,对应唯一个ip地址,kexuetansuo_12385/index.shtml对应路径和文件名。
分别说明HTML,CSS,JavaScript在WEB网页设计中的作用
HTML是网页内容的载体 内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。
CSS样式是表现 就像网页的外衣，比如：标题字体、颜色变化、为标题加入背景图片、边框等。
所有这些用来改变内容外观的东西称之为表现。
HTML、CSS、JavaScript分别实现什么功能？JavaScript是用来实现网页上的特效效果
比如：鼠标滑过弹出下拉菜单、鼠标滑过表格的背景颜色改变、焦点新闻的轮换。
可以理解为：有动画的、有交互的一般都用JavaScript来实现。
(1)html、htm为后缀，首页文件命名 index.html、default.html
(2)、头部(head)、主体(body) 显示网页内容
(3)单、双，双，开始（首）、结束（尾）
(4) xhtml4.0文档三种类型，严格型（Strict）、过渡型（Transitional）、框架型（Frameset）、<!doctype html>
设置body显示信息颜色为红色的属性是(text)
字体属性的标记（color）（face）（size）
字标记对齐方式 <h1 align="center">'''</h1> right left justify（两端）表示字体标记<br>单标记段落标记<p></p> 版权符号是©插入一条水平分隔线<hr>
标记<b></b> 与<strong></strong>功能相同 定义粗体 标记<i></i> 与<em></em>功能相同 定义斜体 删除<del></del> <s></s> 下画线<ins></ins> <u></u>
<ruby></ruby>标记由一个或多个需要解释/发音的字符和一个提供该信息的<rt></rt> 还包括可选的<rp></rp>
定义列表中项目描述使用的标记<dd></dd> 无序列表type默认值disc 定义有序列表<ol></ol> uL标记之间必须用<li></li>标记的作用是添加列表项值 有序列表start值改变起始值，该属性值类型是整型数值 列表项value的属性可以改变项目前面编号
电子邮箱链接 只指定了主题<a href="mailto:abc@163.com?subject=Hello%20again">发送Email</a> 规定图像URL的属性src rect矩形 circle圆形poly多边形 hspace和vspace作用是设置滚动文字背景和它周围文字及图像之间的空白空间范围 <object>插入多媒体文件<Marquee>插入滚动文字 <img>插入图像
CSS由选择器和声明构成 css定义多次引用样式 超链接选择器 优先级最高的行内样式
width设置宽度 height设置高度 alt替换文本
导入外部样式表格式 @import url（“chu12015.css”）
css #p1{}标记使用id属性引用样式 .p2{}定义样式 使用class属性引用样式 引用外部css一是通过link标记的href属性 二是通过style标记@import url来引用 定义图层<div></div>
行内标记的是<SPAN></SPAN>可以通过id,class，style来实现 多图层实现层叠必要条件position属性为absolute 可以设置z-index属性实现 清除div左右浮动属性是clear 图层四个属性left top width height
div和span的区别是：div标签是块级元素，每个div标签都会从新行开始显示，占据一行；div标签内可以添加其他的标签元素（行内元素、块级元素都行）。而，span标签是行内元素，会在一行显示；span标签内只能添加行内元素的标签或文本。
css盒模型属性 内容(content)、内边距(padding)、边框(border)、外边距(margin)
段落缩进 text—indent 文本居中 text-align：center 设置文字颜色红色color：red，RGB(100%,0,0)，rgb（255，0，0），#FF0000,#F00
border：2px double red；2像素宽的双线边框 红色
div{display：none}图层div不显示 div {
visibility: hidden; /* 隐藏div元素 */
}
float 属性仅支持 left、 right 或 none 三个取值
display: block 用于控制元素的布局方式，使其在页面上以块的形式呈现，而 visibility: visible 用于控制元素的可见性，不会改变元素的布局方式。
设置围绕表格边框宽度<table border=“”> 定义表头的标记<th></th> 表格的标题标记<caption></caption> 行标记tr></tr> 单元格跨3行 <td rowspan=“3”></td> 跨5列<td colspan=“5”></td> 外部边框样式可以用frame属性定义 内部可以用rules属性来定义
单元格边距属性cellspacing 间距属性cellpadding
表单是web浏览器和web服务器信息交流传递桥梁 form标记中method属性取值 post get
<SELECT>必须和<option>配合 包含name,size，multiple属性 textarea多行文本输入框 指定行数rows 指定列数为cols 重置按钮type值 reset 提交submit 普通button 复选框name value必须不相同 单选框name相同 value不相同 checked属性设置默认预选 selected可以将下拉列表框中某一设置默认 fieldset定义域 legend定义域标题 src source加载不同格式媒体文件
插入js代码需使用<script type=“text/JavaScript”></script> 引用外部文件<script src=“show.js”></script> javascript对话框 告警框 确认框 提示框 18/0的值infinity
HTML5的组成结构
<html>
<head>
<title>这是头部名称</title>
</head>
<!--head表示头部部分-->
<body>
这是主体部分
</body>
<!--body表示主体部分-->
</html>
CSS样式从低到高优先级
标记样式 类样式 id样式 行内样式
设计一个二行二列的表格,边框2PX,表格文字居中的HTML代码
<table border="2" cellspacing="0" cellpadding="10" style="border-collapse: collapse; text-align: center;"> <tr> <td>第一行，第一列</td> <td>第一行，第二列</td> </tr> <tr> <td>第二行，第一列</td> <td>第二行，第二列</td> </tr> </table>
在表格右边加一行合并第一行
<table border="2" cellspacing="0" cellpadding="10" style="border-collapse: collapse; text-align: center;"> <tr> <td colspan="2">合并第一行</td> <td>第一行，第三列</td> </tr> <tr> <td>第二行，第一列</td> <td>第二行，第二列</td> <td>第二行，第三列</td> </tr> <tr> <td>第三行，第一列</td> <td>第三行，第二列</td> <td>第三行，第三列</td> </tr> </table>
<!doctype html><html><head><title>表格</title></head><body><center><h1>员工信息列表</h1></center><hr><!--border="1px" 设置表格的边框为1像素宽度。width 宽度height 高度--><table align="center" border="1px" width="60%" height="150px"><!--align对齐方式--><tr align="center"><td>a</td><td>b</td><td>c</td></tr><tr><td>d</td><td>e</td><td>f</td></tr><tr><td>x</td><td>y</td><td align="center">z</td></tr></table></body></html>
一、网页设计标题标记
1.标题标记 h1-h6：由小到大有六种，是对网页内容的重要分段标识，可以帮助搜索引擎判断网页内容，且h1-h3一般为页面内容重要标识，h4-h6一般为子页面或嵌套页面的小标题。
2.文本标记：标记不是网页标题，而是提供一些其他功能。可分为行级标记、文本样式标记、行内样式标记和多媒体标记四种：
行级标记：可将全文内容分段，有p、div、span等；
文本样式标记：用于文本样式的定义，有strong、em、i等；
行内样式标记：用于文本内容的内部修饰，有a、img、br等；
多媒体标记：用于插入多媒体文件，有audio、video和object等。
3.结构标记：除了标题和文本标记，结构标记也非常重要，有头部标记、列表标记、表格标记以及表单标记等。
头部标记：用于定义网页内容，有head、meta、title、body等；
列表标记：用于定义列表，有ol、ul、li等；
表格标记：定义表格，有table、tr、td等；
表单标记：用于定义用户输入模块，有form、input、select等。
四种网页设计标题标记只是部分网页标记列表，除此之外，还有很多其他的标记，比如ins、title等，也可以用于网页设计。
<P>称为段落标记。作用：为字、画、表格等之间留一空白行。
<BR>称为换行标记。作用：令字、画、表格等显示于下一行。
<HR>称为水平线。作用：插入一条水平线。
<CENTER>称为居中标记。作用：令字、画、表格等显示于中间。
<PRE>称为预设格式标记。作用：令文件按照原始码的排列方式显示。
<DIV>称为区隔标记。作用：设定字、画、表格等的摆放位置。
<NOBR>称为不折行标记。作用：令某些文字不因太长而绕行，一 显示于同一行或下一 行。它对住址、数学算式、一行数字、程式码等尤为有用。
<WBR>称为建议折行标记。作用：预设折行部位。
写出HTML、CSS、JavaScript三大部分程序注释的方法。（4分）
答：（1）HTML中注释方法有两种：<!—注释1–>、程序注释2（1.5分）；
（2）CSS中注释可以用“/* 这是样式表注释 /” （1分）；
（3）JavaScript中可以用三种：单行注解//；多行注释/ 这是多行注释 */（1.5分）；
3．JavaScript关于标记符命名规定是什么？（3分）
答：JavaScript关于标识符的规定有：
（1）必须使用字母或者下划线开始（0.5分）；
（2）必须使用英文字母、数字、下划线组成，不能出现空格或制表符（1分）；
（3）不能使用JavaScript关键词与JavaScript保留字（0.5分）；
（4）不能使用JavaScript语言内部的单词，比如Infinity,NaN,undefined（0.5分）；
（5）大小写敏感，也就是说x和X是不一样的两个标识符（0.5分）。
三、看图填充程序（每空2分，共36分）
（1） align=“center” （2）
（3） font-size:28px （4） margin:0 auto
（5） name=“rigtiframe” （6） target
（7） middle （8） font-weight
（9） bordercolor （10） align=“center”
（11） colspan=“3” （12） class=“red”
（13） src=“sum_factorial.js” （14） readonly
（15） type=“button” （16） sum=sum+result |sum+=result
（17） compute_sum(n) （18） sum
（19） transform:scale （20） transform:skew
（21） transform:matrix （22） vertical-align:top
（23） id=“div3”
————————————————
三、看图填充程序（每空2分，共36分）
（1） 欢迎学习Web客户端编程 （2） alert(“Web客户端编程很好学！”);
（3）
web前端开发技术
（4）
（5）
1.HTML
（6）
2.CSS
（7） background:#99ff99 （8） 2px double #ff3333
（9） font-size:24px （10）
（11） 软件工程 （12） color:white
（13） font-weight:bold （14） i<=7|i<8
（15） number[i]=“0”+number[i] （16）document.getElementById(num)
（17） readonly （18）selectnumber(‘number1’)
（19） list （20）placeholder
（21） datalist，datalist （22）id
二、填空题（每空1分，共20分）
（1） 单 （2） 双
（3） © （4） face
（5） size （6） _blank
（7） 课程成绩表 （8） body|主体
（9） button （10） . (点)
（11） # （12） var today=new Date();
（13） 0-100 （14） 内部样式表
（15） 导入样式表 （16） 链入样式表
（17） （18） rowspan
（19） src （20） circle
————————————————
二、填空题（每空1分，共20分）
（1） （2）
（3） sum+=1/(2*n-1) （4） face|size
（5） size | face （6） 5
（7） 外部链接 （8）
（9） file （10） 属性
（11） [属性]值 （12） join(“-”)
（13） 十六进制 （14） 标记样式
（15） 类样式 （16） id样式
（17） 4 （18） #
（19） -300 （20） 2014
