有哪些信誉好的足球投注网站- 1、本文档共13页，可阅读全部内容。
- 2、有哪些信誉好的足球投注网站（book118）网站文档一经付费（服务费），不意味着购买了该文档的版权，仅供个人/单位学习、研究之用，不得用于商业用途，未经授权，严禁复制、发行、汇编、翻译或者网络传播等，侵权必究。
- 3、本站所有内容均由合作方或网友上传，本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺！文档内容仅供研究参考，付费前请自行鉴别。如您付费，意味着您自己接受本站规则且自行承担风险，本站不退款、不进行额外附加服务；查看《如何避免下载的几个坑》。如果您已付费下载过本站文档，您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等，请点击“版权申诉”（推荐），也可以打举报电话：400-050-0827(电话支持时间：9:00-18:30)。
第
第PAGE7页共NUMPAGES13页
考生姓名 准考证号
2020年下半年 Web前端开发初级 实操考试
（考试时间14:00-16:30共150分钟）
1.本试卷共4道题，满分100分。
2.请在指定位置或开发环境下作答。
试题一（24分）
阅读下列说明、效果图和HTML及CSS代码，进行静态网页开发，填写（1）至（12）代码。
【说明】
现在根据项目需求，需要实现跳动的心，项目中包含index.html、css文件夹、img文件夹。
【效果图】
图1-1
【代码：头部index.html】
!--?补齐HTML的头标记?--
!_____(1)_____?html
html
????head
????????!--?完成外部样式的引入?--
????????_____(2)_____?rel=stylesheet?href=css/index.css
????????meta?charset=UTF-8
????????!--?填入合适的标签名?--
????????_____(3)_____跳动的心_____(4)_____
????/head
????body
???????!--?结合上下文选择合适的选择器--
????????div?_____(5)_____=chest
????????????div?class=left?heart?side/div
????????????div?class=center?heart/div
????????????div?class=right?heart?side/div
????????/div
????/body
/html
【代码：CSS文件index.css】
body{
????margin:?0;
????padding:?0;
????background-color:?pink;
}
.chest{
????width:?500px;
????height:?500px;
????margin:?_____(6)_____;????/*设置盒子左右居中，上下边距为50px*/
????position:?_____(7)_____;???????/*设置相对定位*/
}
.heart{
????width:?210px;
????height:?210px;
????position:_____(8)_____;????/*设置绝对定位*/
????background:?_____(9)_____(-90deg,#B80734?-306%,#d5093c?48%);/*设置线性渐变*/
????animation:?beat?0.7s?ease?0s?_____(10)_____;/*设置无限次循环*/
}
.center{
????transform:?_____(11)_____;???/*绕着z轴旋转45°*/
????left:145px;
????top:145px;
}
.side{
????border-radius:?105px;??
}
.right{
????right:?68px;
????top:?68px;
}
.left{
????left:?68px;
????top:?68px;
z-index:3;?
}
/*定义动画*/
_____(12)____?beat{
????0%{?
????????transform:?scale(1)?rotate(45deg);
????????box-shadow:?0?0?40px?#d5093c;
????}
????50%{
????????transform:scale(1.1)??rotate(45deg);???/*缩放1.1倍*/
????????box-shadow:?0?0?70px?#d5093c;
????}
????100%{
????????transform:?scale(1)??rotate(45deg);
????????box-shadow:?0?0?40px?#d5093c;
????}
}
【问题】（24分，每空2分）
进行静态网页开发，补全代码，在（1）至（12）处填入正确的内容。
试题二（28分）
阅读下列说明、效果图，进行静态网页开发，填写（1）至（14）代码。
【说明】
根据业务需求，需要完成全选和反选功能如图2-1。包含首页index.html、css文件夹，其中，css文件夹包含index.css文件。
请根据图中的效果和提供的代码，在对应代码处将空缺代码补全。
【效果图】
图2-1
【代码：index
文档评论（0）