共计 6341 个字符，预计需要花费 16 分钟才能阅读完成。
- 一、选择题(每题 2 分)
1、在 HTML 中，要定义一个空链接应用的标记是？A
A、<a href='#'>
B、<a href=';'>
C、<a href='@'>
D、<a href='!'>2、以下对 html 的形容不正确的是？A
A、html 是一种超文本标记语言，标签不能穿插嵌套应用；不能在 html 中插入非凡标签，比方：img
B、html 是一种超文本标记语言，标签能够穿插嵌套应用，能够在 html 中插入非凡标签，比方：img
C、html 是一种超文本标记语言，大小写不敏感，标签能够穿插嵌套应用
D、html 是一种超文本标记语言，大小写敏感，标签能够穿插嵌套应用
3、以下哪个标签能够实现强制换行？A
A、br
B、dr
C、hr
D、dl
5、在 HTML 中，上面不属于 HTML 文档 的根本组成部分的是？C
A、<html>
B、<body>
C、<style>
D、<head>
6、下列 CSS 代码中有几处语法错误？C (包含 &，666666)
&li {font-size:12px , color:666666;}
A、1
B、2
C、3
D、4
7、下列在 HTML 文档中插入样式表的形式，优先级最高的是？B
A、内部 link 引入
B、style 属性（行内的优先级高于外联式）C、内部 @import 引入（写在外联 css 外面，相当于内部引入）D、style 标签
8、实现成果：链接字体色彩为红色，无下划线，当鼠标移过期显示下划线。以下选项正确的是？D
A、a:link{color:red;} a:hover{text-decoration:underline;}
B、a{color:red;text-decoration:none;} a:hover{text-decoration:overline;}
C、a{text-decoration:underline;} a:hover{color:red;text-decoration:none;}
D、a{color:red;text-decoration:none;} a:hover{text-decoration:underline;}
9、下列对于 CSS 中盒子模型说法谬误的是？A
A、padding 代表盒子与其余盒子之间的间隔 (内容区与边框的间隔)
B、border 代表盒子的边框
C、能够通过 box-sizing 属性设置不同的盒子模型：W3C 规范盒子、边框盒子
D、盒子模型是页面布局的根底，它包含外边距、边框、内边距以及元素的内容
10、上面代码中，段落 p 标签内文本最终显示的色彩是？C
<style type='text/css'>
body {color:#333;}
#text{color:#666;}
body p.content {color:#00f;}
p.gray {color:#f00;}
</style>
<p id='text' class='content gray'> 挪动互联方向 </p> ------->>>>id 选择器的优先级高于类选择器
A、#F00
B、#00F
C、#666
D、#333
补充一题：
在 HTML 中，若实现点击超链接，如何弹出一个新的网页窗口？B
A、<a href='https://www.baidu.com' target="_self"> 百度
B、<a href='https://www.baidu.com' target="_blank"> 百度
C、<a href='https://www.baidu.com' target="_new"> 百度
D、<a href='https://www.baidu.com' target="_top"> 百度
二、填空题（每题 4 分）
1. html 中的正文为__<!---->____,CSS 中的正文为__/* */_____。2. 表格中合并单元格的属性为 cellspacing，定义表格与内容间距的属性为 cellpadding，列合并的属性为 colspan，行合并的属性为 rowspan。3. 表单中单选框为 radio，复选框为 checkbox，单行文本框为 text，文件上传按钮为 file，多行文本框为 textarea，下拉菜单为 select
4.form 表单中定义表单提交形式的属性为 method，其常见的属性值为 get 和 post , action 属性示意当提交表单时，向何处发送表单数据。5、css 中盒子模型有 边框 盒子 和 内容 盒子；通过 border-box 属性批改盒子模型；给 边框 盒子设置宽度时，设置的宽度值间接设置给盒子的宽度；三、简答题(每题 5 分)
1、简述块级元素在父元素的居中办法有哪些？
- 子绝父相，margin：auto, top:0,bottom:o,left:0,right:0
- 子绝父相，top:50%,left:50%, margin-top: 子元素高度的一半，margin-left：子元素宽度的一半
- 使用 flex 布局，父元素 display:flex,justify-content:center; align-items:center
- 父元素 display:table-cell; vertical-align:middle; 子元素 margin:auto
2、革除浮动的形式有哪些？
- 给父元素 overflow：hidden
- 在子元素的前面增加一个空白 div，设置属性为 clear:both
- 浮动元素的父级元素：::after{clear:both;content:'';display:block;}
3、块级元素有哪些？行内元素有哪些？行内元素与块级元素别离有什么特点？如何给行内元素设置宽高？
- 块级元素有 p，h1~h6，div，ul>li，ol>li，body，html，section，form，table
- 行内元素有 span，a，b(加粗)，i(斜体)，img，strong(加粗)，input，textarea，select
- 行内元素的特点：1. 和其余元素都在一行
2. 高度、宽度以及内边距都是不可控的
3. 宽高就是内容的高度，不能够扭转
4. 行内元素只能行内元素，不能蕴含块级元素
- 块级元素的特点：1. 独占一行
2. 高度、宽度都是能够设置的
3. 宽度没有设置时，默认为 100%
4. 块级元素中能够蕴含块级元素和行内元素4、简述父子级外边距合并问题的几种解决方案？
- 给父元素增加边框属性，border
- 将本应该设置给子元素的 margin 设置给父元素的 padding
- 给父级或者子级增加 float 属性
- 给父级或者子级增加 position: absolute;
- 给父元素或者子元素增加 display: inline-block;
- 给父级元素增加 overflow: hidden;5、简述 html 中引入 css 的形式有哪些？并阐明区别；
三种
- 外部 style 标签【外部样式表】- 内联 style 属性【内联样式表】- 内部 link 导入【内部样式表】- @import 导入
6、简述将本地代码提交至 gitee/github 的步骤
git init
git add *
git commit -m '[小仙女]第一次提交'
git pull origin master
git push origin master 7、简述设置元素的暗藏和显示的三种形式？区别是什么？
1. display 浏览器是否显示该元素, 如果暗藏也不占据页面空间
- display: none ----->> 将元素的显示设为无，即在网页中不占任何的地位
- display: block----->> 显示被暗藏的元素
2. opcity:0 浏览器不显示该元素, 然而会占据页面空间，交互事件失常
3. visibility 浏览器不显示该元素, 然而会占据页面空间，交互事件生效
- visibility: hidden ----->> 将元素暗藏，然而在网页中该占的地位还是占着
- visibility: visible ------>> 显示被暗藏的元素8、用 css 代码实现轮播图？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> 轮播图 </title>
<style>
*{
margin: 0;
padding: 0;
list-style: none;
}
.wrap{
width: 400px;
height: 300px;
margin: 100px auto;
/* border: 2px solid blueviolet; */
overflow: hidden;
}
.content{
width: 1600px;
height: 300px;
/* background-color: chartreuse; */
/* margin-left: -400px; */
/* 动画名称
animation-name: move; */
/* animation-duration: 5s; */
/* 动画播放速度 */
/* animation-timing-function: linear; */
/* 动画播放次数 */
/* animation-iteration-count: infinite; */
/* steps() 逐帧播放 */
/* infinite 循环播放 */
animation: move 4s infinite steps(4);
/* 动画延迟时间
animation-delay: 4s;
动画填充模式
animation-fill-mode: backwards;
animation-play-state: paused;
animation-direction: alternate; */
}
/* 光标滑过动画暂停 */
.content:hover{animation-play-state: paused;}
.content ul li{
width: 400px;
height: 300px;
float: left;
}
/* .content ul li:nth-child(odd){background-color: cornflowerblue;}
.content ul li:nth-child(even){background-color: cyan;} */
.content ul li img{
width: 400px;
height: 300px;
/* background-size: 100%; */
}
@keyframes move{
from{margin-left: 0;}
to{margin-left: -1600px;}
}
</style>
</head>
<body>
<div class="wrap">
<div class="content">
<ul>
<li><img src="https://yanxuan-item.nosdn.127.net/d02bdeac95f9493cb9062a7455821384.png?type=webp&imageView&quality=95&thumbnail=355x355"></li>
<li><img src="https://yanxuan-item.nosdn.127.net/670456928cd4f6a42ca47226e3b832eb.jpg?type=webp&imageView&quality=95&thumbnail=355x355"></li>
<li><img src="https://yanxuan-item.nosdn.127.net/a0c3f252a1826411be45f58b1d0be19d.jpg?type=webp&imageView&quality=95&thumbnail=355x355"></li>
<li><img src="https://yanxuan-item.nosdn.127.net/0ae4a38da4f742b01a89dd840f7239d6.png?type=webp&imageView&quality=95&thumbnail=355x355"></li>
</ul>
</div>
</div>
</body>
</html>9、请写出至多 10 个文本、字体款式属性？
font-size: 大小
color: 字体色彩
font-weitht：粗细
text-indent：首行缩进
text-decrotion：增加下划线
text-transform：扭转字体大小写
font-family：字体
word-spacing：减少或缩小单词间的空白（即字距离）letter-spacing：减少或缩小单个字符间的空白（字符间距）word-break：规定主动换行的解决办法（如：word-break:break-all;）word-wrap：容许长单词或 URL 地址换行到下一行
overflow：规定当内容溢出元素框时产生的事件
hidden：规定对元素进行暗藏
scroll：滚动条
width：height：max-width：定义元素的最大宽度
max-height：定义元素的最大高度
min-width：设置元素的最小宽度
min-height：设置元素的最小高度
10、请写出至多 5 个 html5 中的新增属性？至多 5 个 html5 中的新增标签？
date 日期
datetime-local 日期工夫控件
time 工夫控件
number 数字控件（只能输出数字）range 范畴控件（通过管制条能够调整取值）search 搜寻控件
tel 电话控件
url 地址控件
color 色彩控件
email email 控件
header 头部
nav 导航栏
article 主体
section 局部
footer 底部
aside 侧边栏至多 5 个 html5 中的新增标签：
1. 构造标签（1）section：独立内容区块，能够用 h1~h6 组成纲要，示意文档构造，也能够有章节、页眉、页脚或页眉的其余局部；（2）article：非凡独立区块，示意这篇页眉中的核心内容；（3）aside：标签内容之外与标签内容相干的辅助信息；（4）header：某个区块的头部信息 / 题目；（5）hgroup：头部信息 / 题目的补充内容；（6）footer：底部信息；（7）nav：导航条局部信息（8）figure：独立的单元，例如某个有图片与内容的新闻块。2、表单标签（1）email：必须输出邮件；（2）url：必须输出 url 地址；（3）number：必须输出数值；（4）range：必须输出肯定范畴内的数值；（5）Date Pickers：日期选择器；a.date：选取日、月、年
b.month：选取月、年
c.week：选取周和年
d.time：选取工夫（小时和分钟）e.datetime：选取工夫、日、月、年（UTC 工夫）f.datetime-local：选取工夫、日、月、年（本地工夫）（6）search：搜寻惯例的文本域；（7）color：色彩
3、媒体标签（1）video：视频（2）audio：音频（3）embed：嵌入内容（包含各种媒体），Midi、Wav、AU、MP3、Flash、AIFF 等。4、其余性能标签（1）mark：标注（像荧光笔做笔记）（2）progress：进度条；11、html 中的锚点如何定义？举例说明
- 就是一个超链接
跳转到 one
12、请写出 css 属性中设置色彩值的几种形式？
1. 关键字；如：red，black，green
2. rgb(r,g,b); 取值范畴在 0 -255 之间，如 rgb(233,244,222)
3. rgba(r,g,b,a);
a：0- 1 取值；0 代表齐全通明，1 代表齐全不通明
4. 16 进制的色彩值；比方 #fff, 取值范畴在 0~f 十六进制数之间
正文完