web开发技术重点

最新推荐文章于 2022-02-28 21:45:48 发布

dlluo

最新推荐文章于 2022-02-28 21:45:48 发布

阅读量853

点赞数 3

分类专栏：笔记

本文链接：https://blog.csdn.net/qq_59049368/article/details/122262444

版权

HTML CSS JavaScript 布局事件处理

关键词由CSDN通过智能技术生成

笔记专栏收录该内容

10 篇文章 1 订阅

订阅专栏

一、单项选择

(30题共30分) 来自课后习题html、css

二、判断

(10题共10分) 来自课后习题html、css

三、简答题

(4题共20分) 八选四

P24 简述HTML代码书写规范

(1)标签可以嵌套使用，但要注意标签间的前后匹配，避免引起交叉而出现语法错误。

(2)HTML代码不区分大小写，但在一个项目中应尽量使用同一种风格，即选择大写或小写的一种。

(3)标签中的属性都会有其属性值，属性值用" "括起来。

(4)编写代码时，为了便于阅读和理解网页结构，一般采用缩进风格。

不同级的标签可以通过缩进显示其对应关系。

(5)HTML文件的类型名可以是.htm或者.html，一般用.html为扩展名。

(6)网站中的首页名一般是index.html或者default.html。

P20 HTML属性的语法要求

(1)每个属性都会有一个值，称为属性值。

(2)该值要用双引号括起来

(3)属性与属性之间要有至少一个空格的分隔距离。

(4)属性名与属性值要成对出现，缺一不可。

P102 CSS基本选择器和用法

P111 简述CSS盒子模型

盒子模型是由内容、边框、填充、边界组成。

内容区域的大小由 width 和height 属性确定；padding属性是指内容与边框之间的间隙，分为上、右、下、左4个值;border 属性是指边框宽度，分为上、右、下、左4个值；margin属性是指边界，其属性值用来控制盒子与盒子之间的间隔，也分为上、右、下、左4个值。

P155 简述HTML表单三个组成部分

一个表单通常由三个部分组成，第一部分是表单标签＜form＞和＜/form＞，这对标签之间的部分就是一个表单,标签的属性描述了处理表单数据所用 CGI 程序的 URL 以及数据提交到服务器的方法。

第二部分是表单域,也叫表单域，也叫表单控件，是表单内容在网页上的具体呈现形式，,这些控件包括文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。

第三部分是表单按钮，包括提交按钮、复位按钮和一般按钮，用于将表单数据传送到服务器上的 CGI 脚本或者取消输入,还可以用表单按钮来控制其他定义了处理脚本的处理工作。

P135 简述div标记与span标记的区别

(1) div标记是块级元素，一般可包含较大的范围，在区域的前后会自动换行;而 span标记是内联元素，一般包含范围较窄，通常在一行内，在区城外不会自动换行。
(2) span 可以作为 div 的子元素，包含在div 元素中。但div 不能作为 span 的子元素,如果 span 中出现 div 不符合页面标准。
(3) span 元素的宽度是由被包围的内容宽度决定的，不建议给 span 设置宽度属性width,可以给 span 设置margin 值。

P215 简述JavaScript脚本特点

(1)它是一种脚本编程语言，采用小程序段的方式实现编程，是一种解释性语言,无须进行编译，在代码运行过程中被逐行地进行解释。它提供了一个简易的开发过程，与HTML 结合在一起，方便用户使用操作。它的数据是弱类型的，未使用严格的类型检查。
(2）它是一种基于对象的语言,许多功能可以来自于脚本环境中对象的方法与脚本的相互作用。
(3）它具有简单性，它的基本语句和控制流设计简单而紧凑，它的变量类型采用弱类型。

P254 简述JavaScript事件分为哪些类型

(1）鼠标事件，是指用户使用鼠标操作网页元素时触发的事件。鼠标事件又分为两
种，一种是追踪鼠标当前位置的事件，如 MouseOver、MouseOut 等;另一种是追踪鼠标被
单单击的事件，如 MouseUp、MouseDown、Click 等。常见的鼠标单击、双击、文本框选择、
单选按钮、复选框按钮选中、移人或移出及在特定区域上盘旋都会触发鼠标事件。
(2）键盘事件，是指用户在键盘上按键、输人时引发的事件。键盘事件负责追踪键盘
的按键何时按下或释放以及在何种上下文中被按下或释放，如 KeyDown、KeyUp 和
KeyPress 等事件。
(3) UI事件,用来追踪用户何时从页面的一部分转到另一部分，如获知用户何时在
-个表单中输人，如 Focus、Blur 等事件。
(4) 表单事件,是指与表单及表单元素上的交互有关的事件。Submit 事件用来追踪
表单何时被提交,Change 事件监视用户向元素的输人,Select 事件在＜select＞元素被更
新时被触发。
(5）窗口事件，是指当窗口发生变动或客户端与服务器端交互时触发的事件，如
Load、Unload 等事件。

四、CSS应用题

(div布局) 例如正文发布区那个上机实验

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>茶叶</title>
	<style type="text/css">
		#all{width: 600px;height: 620px;border: 2px solid #000;margin:0px auto;}
		#top{height: 61px;}
		#mid{height: 425px;}
			#left{width: 174px;height: 425px;float: left;}
				#left1{height: 143px;}
				#center{height: 142px;}
				#left2{height: 140px;}
			#right{width: 426px;height: 425px;float: left;/*text-align: center;*/}
		#bott{height: 134px;}
	</style>
</head>
<body>
	<div id="all">
		<div id="top">
			<img src="image\top.jpg">
		</div>

		<div id="mid">
			<div id="left">
				<div id="left1"><img src="#"></div>
				<div id="center"><marquee direction="up"><p>茶爽添诗句，</p><p>天清莹道心，</p><p>只流鹤一只，</p><p>此外是空林。</p></marquee></div>
				<div id="left2"><img src="image\left2.jpg"></div>
			</div>
			<div id="right">
				<h4>未经许可不准卖安溪茶</h4>
<p>2016-3-20</p>
<p>(2016-03-20 13:27:38)</p>
<p>安溪县两项铁观音新政引起厦门茶商强烈反响</p>
<p>本报讯（记者 曾海林） 无须任何许可、租间小店就能卖安溪茶的时代可能即将结束。记者从近日召开的安溪县茶业产业工作会上获知，安溪县将在今年内推行“安溪铁观音经营许可制度”和“安溪铁观音产地确认制度”两项茶经营新政，让消费者买正宗安溪铁观音有了制度保障。</p>
<p>据悉，“安溪铁观音经营许可制度”经营资质设定要求，经营企业要在安溪境内拥有经确认的生产基地，个体工商户必须提供与安溪境内茶农或产品供应商的购销合同证明，生产经营企业要有评审室、质量检测及卫生保证设备，并且要有一定数量的茶业专业人才。</p>
<p>来源：厦门晚报</p>

			</div>
		</div>

		<div id="bott">
			<img src="image\bott.jpg">
		</div>



	</div>
	
</body>
</html>

五、JavaScript编程题

（2题共15分）数组+数据对象的事件

时间滚动的例子

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>滚动时间</title>
</head>
<body>
<marquee dirction="up">
<script type="text/javascript">
	var cur=new Date();
	var y=cur.getFullYear();
	var m=cur.getMonth();
	var d=cur.getDate();
	var w=cur.getDay();
	var w1;
	if(w=1)     {w1="一";}
	else if(w=2){w1="二";}
	else if(w=3){w1="三";}
	else if(w=4){w1="四";}
	else if(w=5){w1="五";}
	else if(w=6){w1="六";}
	else if(w=7){w1="日";}

	document.write("今天是:"+y+"年"+m+"月"+d+"日"+"星期"+w1);

</script>
</marquee>
</body>
</html>