实践操作题9--千峰教育培训网站.zip
资源内容介绍
实践操作题9--千峰教育培训网站.zip <link href="/image.php?url=https://csdnimg.cn/release/download_crawler_static/css/base.min.css" rel="stylesheet"/><link href="/image.php?url=https://csdnimg.cn/release/download_crawler_static/css/fancy.min.css" rel="stylesheet"/><link href="/image.php?url=https://csdnimg.cn/release/download_crawler_static/89579448/raw.css" rel="stylesheet"/><div id="sidebar" style="display: none"><div id="outline"></div></div><div class="pf w0 h0" data-page-no="1" id="pf1"><div class="pc pc1 w0 h0"><img alt="" class="bi x0 y0 w1 h1" src="/image.php?url=https://csdnimg.cn/release/download_crawler_static/89579448/bg1.jpg"/><div class="c x0 y1 w0 h2"><div class="t m0 x1 h3 y2 ff1 fs0 fc0 sc0 ls0 ws0">《网页设计与开发》项目化考核题库</div></div><div class="t m0 x2 h4 y3 ff2 fs1 fc0 sc0 ls0 ws0">千峰教育培训网站项目</div><div class="t m0 x3 h5 y4 ff3 fs2 fc0 sc1 ls0 ws0">完成如下图<span class="_ _0"></span>所示的网页<span class="_ _0"></span>效果</div></div><div class="pi" data-data='{"ctm":[1.611830,0.000000,0.000000,1.611830,0.000000,0.000000]}'></div></div><div id="pf2" class="pf w0 h0" data-page-no="2"><div class="pc pc2 w0 h0"><img class="bi x0 y0 w1 h1" alt="" src="/image.php?url=https://csdnimg.cn/release/download_crawler_static/89579448/bg2.jpg"><div class="c x0 y1 w0 h2"><div class="t m0 x1 h3 y2 ff1 fs0 fc0 sc0 ls0 ws0">《网页设计与开发》项目化考核题库</div></div><div class="t m0 x3 h5 y5 ff3 fs2 fc0 sc1 ls0 ws0">具体要求：</div><div class="t m0 x3 h6 y6 ff4 fs3 fc0 sc0 ls0 ws0">1.<span class="_ _1"> </span><span class="ff1">页<span class="_ _1"> </span>面<span class="_ _1"> </span>根<span class="_ _1"> </span>据<span class="_ _1"> </span>需<span class="_ _1"> </span>求<span class="_ _1"> </span>采<span class="_ _1"> </span>用<span class="_ _2"> </span></span>DIV+CSS<span class="_ _2"> </span><span class="ff1">布<span class="_ _1"> </span>局<span class="_ _1"> </span>、<span class="_ _1"> </span>网<span class="_ _1"> </span>格<span class="_ _1"> </span>布<span class="_ _1"> </span>局<span class="_ _1"> </span>或<span class="_ _1"> </span>者<span class="_ _1"> </span>弹<span class="_ _1"> </span>性<span class="_ _1"> </span>盒<span class="_ _1"> </span>布<span class="_ _1"> </span>局<span class="_ _1"> </span>，<span class="_ _1"> </span>命<span class="_ _1"> </span>名<span class="_ _1"> </span>为</span></div><div class="t m0 x3 h6 y7 ff4 fs3 fc0 sc0 ls0 ws0">index.html<span class="ff1">，页面主体内容的宽度要符合网站视觉效果。</span></div><div class="t m0 x3 h6 y8 ff4 fs3 fc0 sc0 ls0 ws0">2.<span class="ff1">顶端<span class="_ _0"></span>问卷<span class="_ _0"></span>部分<span class="_ _0"></span>。表单<span class="_ _0"></span>外观<span class="_ _0"></span>与效<span class="_ _0"></span>果图一<span class="_ _0"></span>致，<span class="_ _0"></span>所有<span class="_ _0"></span>内容水<span class="_ _0"></span>平居<span class="_ _0"></span>中，<span class="_ _0"></span>背景色<span class="_ _0"></span></span>#666666<span class="ff1">，</span></div><div class="t m0 x3 h6 y9 ff1 fs3 fc0 sc0 ls0 ws0">始终停留在浏览器上方。</div><div class="t m0 x3 h6 ya ff4 fs3 fc0 sc0 ls0 ws0">3. logo<span class="_ _3"> </span><span class="ff1">部分。图片和文字与效果图一致。</span></div><div class="t m0 x3 h6 yb ff4 fs3 fc0 sc0 ls0 ws0">4.<span class="ff1">主导航部分。<span class="_ _4"></span>通栏布局，<span class="_ _4"></span>导航菜单默认文字颜色<span class="ff4">#EAF4FA</span>，<span class="_ _4"></span>背景<span class="ff4">#018ED6</span>，<span class="_ _4"></span>鼠标</span></div><div class="t m0 x3 h6 yc ff4 fs3 fc0 sc0 ls0 ws0">hover<span class="_ _3"> </span><span class="ff1">时一级菜单项显示为按钮式导航<span class="_ _4"></span>（背景色<span class="ff4">#39ADEA</span>）<span class="_ _5"></span>，<span class="_ _4"></span>文本白色加粗，<span class="_ _4"></span>无下</span></div><div class="t m0 x3 h6 yd ff1 fs3 fc0 sc0 ls0 ws0">划<span class="_ _0"></span>线<span class="_ _0"></span>，<span class="_ _0"></span>设<span class="_ _0"></span>置<span class="_ _0"></span>空<span class="_ _0"></span>链<span class="_ _0"></span>接<span class="_ _0"></span>。<span class="_ _0"></span>为<span class="_ _0"></span><span class="ff5">“<span class="_ _0"></span></span>认<span class="_ _0"></span>证<span class="_ _0"></span>考<span class="_ _0"></span>试<span class="_ _0"></span><span class="ff5">”<span class="_ _0"></span></span>设<span class="_ _0"></span>置<span class="_ _0"></span>二<span class="_ _0"></span>级<span class="_ _0"></span>弹<span class="_ _0"></span>出<span class="_ _0"></span>式<span class="_ _0"></span>菜<span class="_ _0"></span>单<span class="_ _0"></span>，<span class="_ _0"></span>鼠<span class="_ _0"></span>标<span class="_ _6"> </span><span class="ff4">hover<span class="_ _6"> </span></span>时显<span class="_ _0"></span>示<span class="_ _0"></span>。</div><div class="t m0 x3 h6 ye ff1 fs3 fc0 sc0 ls0 ws0">二级菜<span class="_ _0"></span>单有<span class="_ _0"></span>两个菜<span class="_ _0"></span>单项<span class="_ _0"></span>，分别<span class="_ _0"></span>是<span class="ff5">“<span class="ff4">PMP<span class="_ _6"> </span></span></span>培训<span class="ff5">”<span class="_ _0"></span></span>和<span class="ff5">“</span>红<span class="_ _0"></span>帽<span class="_ _3"> </span><span class="ff4">RHCE<span class="_ _3"> </span></span>认<span class="_ _0"></span>证<span class="ff5">”<span class="_ _7"></span><span class="ff1">，背景<span class="_ _0"></span>色白</span></span></div><div class="t m0 x3 h6 yf ff1 fs3 fc0 sc0 ls0 ws0">色，文字颜色黑色，鼠标移入二级菜单项时文字变为红色。</div><div class="t m0 x3 h6 y10 ff4 fs3 fc0 sc0 ls0 ws0">5.<span class="ff1">主体部分。和浏览器等宽，背景图片<span class="_ _3"> </span></span>banner.jpg<span class="ff1">，左侧垂直导航覆盖在<span class="_ _3"> </span></span>banner</div><div class="t m0 x3 h6 y11 ff1 fs3 fc0 sc0 ls0 ws0">图片上方，<span class="_ _4"></span>半透明黑色背景，<span class="_ _8"></span>鼠标放上去背景变为白色，<span class="_ _8"></span>文字变为黑色，<span class="_ _4"></span>设置空</div><div class="t m0 x3 h6 y12 ff1 fs3 fc0 sc0 ls0 ws0">链接。</div></div><div class="pi" data-data='{"ctm":[1.611830,0.000000,0.000000,1.611830,0.000000,0.000000]}'></div></div>