HTML语言基础练习题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
第一部分：基础词汇1、单词
head，头body，身体block，块inline，一行内width，宽度height，高度image，图像title，标题parent，父亲blank，空白的table，表格row，行character，字符
column，列
caption，说明文字
list，列表
form，表单
type，类型
input，输入
text，文本
password，密码
value，值
select，选择
option，选项
textarea，文本域
submit，提交
button，按钮
reset，重置
action，动作
method，方法
target，目标
left，左
right，右
center，中
top，上
bottom，下
2、词语缩写
术语：HTML，HyperText Markup Language，超级文本标记语言
术语：URL，Uniform Resoure Locator，统一资源定位器
术语：HTTP，Hyper Text Transfer Protocol，超文本传输协议
术语：WWW，World Wide Web，万维网
术语：IP，Internet Protocol，网络互连协议
属性：src，source，源
属性：href，hypertext reference，超文本引用
属性：id，identification，身份证、唯一标识
属性：class，类别
属性：title，标题、字幕
属性：style，样式
标签：a，anchor，锚或超链接
标签：div，division，部分区域
标签：ul，unordered lists，无序列表
标签：ol，ordered lists，有序列表
标签：img，image，图像
标签：p，paragraph，段落
标签：meta，metadata，元数据、描述信息的数据
第二部分：HTML基本结构（以html5为例）
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>页面标题</title>
</head>
<body>
页面元素及内容部分
</body>
</html>
第三部分：看页面效果图，写出HTML代码
1、当鼠标光标移动至段落上时，要求显示字幕信息“我是段落”。
<h1>我是一级标题</h1>
<p title="我是段落">这是一个段落</p>
2、有一幅鲜花图片，名称为“flower.jpg”,假设图片与网页文件在同一个文件夹内，设置鲜花图片的高度为85px，宽度为100px，并要求实现鼠标指针停留在图片上时，显示字幕“鲜花”。
<p>第一个段落</p>
<img src="./flower.jpg" title="鲜花" width="100px" height="85px" />
<p>第二个段落</p>
3、
<p>HTML水平线标签<hr /></p>
<hr />
4、其中，图片名称为“yzxx.png”,假设图片与网页文件在同一个文件夹内，超链接的链接地址为"/yzxx.jsp"。
跳转到百度：<a href="">百度</a>
图片超链接：<a href="/yzxx.jsp"><img src="yzxx.png" /></a>
5、
<ul type="circle">
<li>柠檬茶</li>
<li>葡萄汁</li>
<li>可口可乐</li>
</ul>
<ol type="A" start="2">
<li>银河系</li>
<li>太阳系</li>
<li>地球</li>
</ol>
6、
<ul>
<li>
学院概况
<ul>
<li>学院简介</li>
<li>信息公开</li>
</ul>
</li>
<li>学院新闻</li>
<li>
系部设置
<ul>
<li>计算机工程系</li>
<li>自动化工程系</li>
<li>基础课部</li>
</ul>
</li>
</ul>
7、
<table border="1">
<caption>设备表</caption>
<tr>
<th>序号</th>
<th>设备名称</th>
<th>设备型号</th>
</tr>
<tr>
<td>1</td>
<td>A设备</td>
<td>HS-1</td>
</tr>
<tr>
<td>2</td>
<td>B设备</td>
<td>HB-4</td>
</tr>
<tr>
<td>3</td>
<td>C设备</td>
<td>WSWS-9</td>
</tr>
<table>
8、性别默认选中“男”，选中“男”时传值“1”，选中“女”时传值“0”，要求使用get方法提交数据到本页面。
<form action="#" method="get">
用户名：<input type="text" name="user" /><br />
密码：<input type="password" name="pass" /><br />
性别：
男<input type="radio" name="sex" value="1" checked="checked"/>
女<input type="radio" name="sex" value="0" /><br />
爱好：
打篮球<input type="checkbox" name="likes" value="打篮球" />
游泳<input type="checkbox" name="likes" value="游泳" />
中国象棋<input type="checkbox" name="likes" value="中国象棋" /><br />
所在城市：
<select name="city">
<option value="北京">北京</option>
<option value="上海">上海</option>
<option value="乌鲁木齐">乌鲁木齐</option>
</select>
<br />
个人介绍：<br /><textarea cols="30" rows="3"></textarea>
<br />
<input type="submit" value="注册" />
<input type="reset" value="重置" />
</form>
留言：<br /><textarea cols="30" rows="3"></textarea>
<br />
<input type="submit" value="提交" />
<input type="reset" value="重置" />
</form>
第四部分：HTML元素归类
1、从以下HTML元素中找出6个块级元素（）
找出3个内联元素（）
找出1个典型的内联块元素是（）
<div>、<span>、<p>、<u>、<img>、<table>、<li>、<a>、<b>、<input>、<ul>、<sub>、<body>、<i>、<h2>、<hr>、<form>
2、分别描述块级元素、内联元素和内联块元素的默认显示特征。
（1）块级元素：①默认情况下，宽度占满其父元素一行；②默认情况下，高度根据内容自适应；③body元素的宽度由当前浏览器窗口宽度决定，其高度默认自适应，当页面内容超
出浏览器窗口时默认产生滚动条；④块级元素的高度和宽度可以自定义；⑤块级元素内部可嵌套块级元素和内联元素。
（2）内联元素：①宽度和高度根据内容自适应；②不可以自定义高度、宽度；③元素内部一般只可嵌套内联元素或者文本。
（3）内联块元素（inline-block）：①宽度和高度根据内容自适应；②可以自定义高度、宽度无效。