1. 一、选择题(每题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    ,下拉菜单为   select4.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,green2. 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 十六进制数之间