阅读下列说明、效果图和HTML代码,进行静态网页开发,填写(1)至(15)代码。 【说明】 这是一个响应式完成,用bootstrap4完成。 项目名称为callio,采用Bootstrap框架,包含首页index.html、css文件夹、js文件夹、img文件夹,其中,css文件夹包含style.css文件和bootstrap.min.css文件;js文件夹包含jquery.min.js文件和bootstrap.min.js文件;img文件夹包含用到的图片。 首页(index.html)使用Bootstrap响应式布局,PC端和移动端能够自适应显示,内容分为四部分: 一是【页头】,包括网页标题和导航栏,导航栏使用了下拉插件,显示菜单,在移动端显示为折叠导航栏; 二是【轮播图】,图片切换时呈现由大缩小的动画; 三是【网站介绍】,主要是介绍分类,采用栅格系统布局,以图片和标题的形式展示,鼠标经过图片放大,且不能溢出; 四是【表单提交】,利用弹性盒子实现表单左侧的介绍相对于表单的高度垂直对居。 【效果图】 (1)index.html在PC端效果如图1-1所示。 (2)index.html在移动端效果如图1-2所示。 【代码:首页index.html】 callio , initial-scale=1, shrink-to-fit=no"> " type="text/css" href="css/bootstrap.min.css"> "> "> "> 首页 HTML/CSS HTML CSS HTML5 CSS3 JAVASCRIPT JQUERY slide carousel-scale" data-ride="carousel"> "> HTML Lorem ipsum dolor sit amet, habitasse sollicitudin adipiscing nemo 更多 JAVASCRIPT Lorem ipsum dolor sit amet, habitasse sollicitudin adipiscing nemo 更多 MYSQL Lorem ipsum dolor sit amet, habitasse sollicitudin adipiscing nemo 更多 ES6 Lorem ipsum dolor sit amet, habitasse sollicitudin adipiscing nemo 更多 PHP Lorem ipsum dolor sit amet, habitasse sollicitudin adipiscing nemo 更多 VUE Lorem ipsum dolor sit amet, habitasse sollicitudin adipiscing nemo 更多 description"> web前端 Web前端在IT行业真正受到重视大概也就六七年的时间。随着互联网的迅猛发展,各种互联网项目也不断兴起,对用户体验提出了更高的要求,前端开发也由此逐渐成为了重要的研发角色。从2012年至今,“Web前端工程师”的需求持续走高,薪酬也是水涨船高,所以,有不少人立志要成为前端开发工程师,但同时又担心Web前端开发到底还能热多久。 Service Form Get Your Service " placeholder="输入用户名"> html css Sign in 版权 【代码:CSS文件style.css】 .carousel-scale .carousel-item img{ transform: ;/*放大到1.12倍*/ } .carousel-scale .carousel-item.active img { animation: scaleUpDown 1s cubic-bezier(0.250, 0.460, 0.450, 0.940);/*让动画保持最终状态*/ } @keyframes scaleUpDown { _ { transform: scale(1.12); } _ { -webkit-transform: scale(1); transform: scale(1); } } .list{ margin-top:2rem; } .list .item{ margin:20px 10px; padding-bottom: 20px; border:1px solid #ccc; _;/*设置边框圆角,四个角都是20px*/ } .list .item .thumb{ overflow: hidden; margin-bottom:1rem; } .list .item .thumb img{ width: 100%; transition: all .8s; } .list .item:hover .thumb img{ transform: scale(1.2); } .list .item h2,.list .item p,.list .item a{ padding:0 2rem; } .message{ padding:3rem 0; border-top:1px solid #ccc; } .message .form{ border:1px solid #ccc; padding:20px 30px; border-radius: 10px; background-color: #eee; } .message .form h2{ padding:20px 0; text-align: center; } .message .form h2 span{ display: block; font-size: 18px; font-weight: normal; } .description h2{ text-align: center; line-height:70px; } .description p{ line-height: 28px; _;//文字首页缩进 } .bottom{ height: 6rem; line-height: 6rem; text-align: center; background-color: #333; color:#fff; } 【问题】 进行静态网页开发,补全代码,在(1)至(15)处填入正确的内容。