这是一个简单的照明材料网站，后续还会更新
1、首页效果图
代码
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title>爱德照明网站首页</title><style>/*=========外部样式===========*/@charset "utf-8";*{margin: 0;padding: 0;box-sizing: border-box;}a{text-decoration: none;}@font-face{font-family: 'iconfont';src: url('../fonts/iconfont.ttf');}body{width: 1050px;margin: 0 auto;font-family: "微软雅黑";font-size: 13px;color: #333;position: relative;}h3{font-size: 16px;color: #545861;font-weight: 500;}h4{font-size: 14px;}h5{font-size:13px;}/*=========页面顶部样式===========*/header{height: 250px;background-color: #FFFFEE;background-repeat: no-repeat;background-position: 50px;}.header-left{height: 50px;}.header-right{width: 250px;height: 50px;line-height: 50px;float: right;}.header-right img{width: 25px;height: 21px;}.header-right a:active,.header-right a:visited{text-decoration: none;color: #111111;}.header-right a:active,.header-right a:hover{color: blue;}.header-text{font-size: 40px;color: #4FAC00;margin-top: 10px;margin-left: 150px;}/*=========导航样式定义===========*/nav{margin-bottom:5px;height: 36px;background-image: linear-gradient(0deg,#9cf,#fff 60%,#9cf 100%);border-bottom: 1px solid #DBEAEE;}nav ul{list-style-type: none;}nav a{display: block;width: 90px;height: 36px;float: left;padding: 0px 8px 0px 8px;margin: 0 10px 0 20px;text-decoration: none;text-align: center;font-family: tahoma;font-size: 14px;font-weight: bold;}nav ul:nth-child(1)a{width: 50px;}nav ul li a:link,nav ul li a:visited{color: #333;}nav ul li a:active,nav ul li a:hover{color: #FFF;background-image: linear-gradient(0deg,#36c,#9CF 60%,#fff 100%);}/*=========网页中部内容样式===========*/#content{width: 1050px;height: auto;}/*=========热销产品列表样式===========*/#hotproduct {height: auto;}#hotproduct ul{list-style: none;width: 1050px;height: 158px;padding: 6px 0 0px 4px;border: 2px solid #DDDDDD;}#hotproduct ul li{width: 160px;display: inline-block;float: left;margin-right: 10px;margin-bottom: 1px;position: relative;-webkit-perspective: 250px;}#hotproduct ul li .evenlist{width: 80px;height: 148px;border-right: 0px;}#hotproduct ul li img{width: 160px;height: 141px;position: absolute;left: 0;top: 0;-webkit-backface-visibility: hidden;transition: all 0.5s ease-in 0s;}#hotproduct ul li img .fan {-webkit-transform: rotateX(-180deg);}#hotproduct ul li :hover img .fan{-webkit-transform: rotateX(0deg);}#hotproduct ul li :hover img .zheng{-webkit-transform: rotateX(180deg);}#hotproduct strong{display: block;margin: 10px 0 0;}#hotproduct a{display: inline-block;width: 75px;height: 26px;background-color: #494949;color: #FFF;text-decoration: none;text-align: center;margin-top: 15px;line-height: 26px;}#hotproduct a ::after{content: url("https://via.placeholder.com");padding-left: 5px;}#main{clear: both;}#main .main_left,#main .main_center,#main .main_right{padding: 0px 20px;margin-top: 20px;position: relative;}main h3 {margin-bottom: 12px;}#main .main_left{width: 307px;padding-left: 0px;float: left;}#main .main_left video{width: 285px;height: 200px;background-color: #CCCCCC;border: 1px solid #BBBBBB;}#main .main_left .lianxi {width: 285px;height: auto;border: 1px solid #DDDDDD;border-radius: 5px;margin-top: 15px;padding: 0 15px;}#main .main_left .lianxi p{font-size: 13px;height: 50px;line-height: 50px;margin-top: 8px;}#main .main_left .lianxi img {width: 43px;height: 43px;float: left;margin-right: 15px;}#main .main_center {width: 390px;border-left: 3px solid #DDD;margin-bottom: 10px;float: left;}#main .main_center ul li {border-top: 1px dotted #999999;padding: 5px 0px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;line-height: 19px;}#main .main_center .date{color: #999999;display: block;margin: 0 0px 10px 10px;}#main .main_right {width: 350px;padding-right: 0px;float: right;}#main .main_right .imgbox{width: 325px;height: 200px;position: relative;overflow: hidden;}#main .main_right .imgbox img {width: 325px;height: 200px;}#main .main_right .imgbox hgroup{padding-top: 20px;text-align: center;position: absolute;left: 0;top: 200px;width: 325px;height: 200px;background: rgba(0,0,0,0.5);transition: all 0.5s ease-in 0s;}#main .main_right .imgbox hgroup h3{color: #BBB;}#main .main_right .imgbox :hover hgroup{position: absolute;left: 0;top: 0;}#main .main_right ul li {line-height: 27px;margin-left: 20px;}#main ul a :link,a :visited {text-decoration: none;color: #333333;}#main ul a:hover{color: red;text-decoration: underline;}#main .more{position: absolute;top: 10px;right: 10px;text-decoration: none;color: #0091D8;}footer {clear: both;height: 100px;background: #545861;border-bottom: 1px solid #fff;color: #ffffff;text-align: center;}footer :link {padding-top: 25px;}footer :link a {display: inline-block;width: 70px;height: 36px;color: #ffffff;padding: 0px 8px 0px 8px;margin: 0 14px 0 14px;text-decoration: none;text-align: center;}footer :link a:hover {color: #ccc;text-decoration: underline;}.online_zx {position: fixed;top: 30px;right: 10px;}</style></head><body><header><!--===============占位符图片===================--><img class="header-left" src="https://via.placeholder.com/150" alt="Placeholder Image"><div class="header-right"><a href="#"><img src="https://via.placeholder.com/150" alt="" srcset="" />官方微信</a> <span style="color: #930;">|</span><a href="login.html">管理员登录</a> <span style="color: #930;">|</span><a href="register.html">会员注册</a> <span style="color: #930;">|</span></div><div class="header-text">照明材料</div></header><!--===================横向导航栏======================--><nav><ul><li><a href="index.html">首页</a></li><li><a href="products.html">产品中心</a></li><li><a href="works.html">工程案例</a></li><li><a href="news.html">新闻动态</a></li><li><a href="about.html">招商加盟</a></li><li><a href="contact.html">联系我们</a></li></ul></nav><!--==================内容区域=====================--><div id="content"><div id="hotproduct"><ul><li><img class="zheng" src="https://via.placeholder.com/150" alt=""><img class="fan" src="https://via.placeholder.com/150" alt=""></li><li class="evenlist"><strong>LED射灯</strong>专业技术<br />高校耐用<br /><a href="led_sd_details.html">详细信息</a></li><!--===============第二个产品图片====================--><li style="margin-left: -80px;"><img class="zheng" src="https://via.placeholder.com/150" alt=""><img class="fan" src="https://via.placeholder.com/150" alt=""></li><li class="evenlist"><strong>LED景观路灯</strong>优越品质<br />绿色环保<br /><a href="led_sd_details.html">详细信息</a></li><!--===============第三个产品图片====================--><li style="margin-left: -80px;"><img class="zheng" src="https://via.placeholder.com/150" alt=""><img class="fan" src="https://via.placeholder.com/150" alt=""></li><li class="evenlist"><strong>LED映红灯</strong>领先科技<br />节能高效<br /><a href="led_sd_details.html">详细信息</a></li><!--===============第四个产品图片====================--><li style="margin-left: -80px;"><img class="zheng" src="https://via.placeholder.com/150" alt=""><img class="fan" src="https://via.placeholder.com/150" alt=""></li><li class="lastlist" style="position: relative;left: 90px;"><strong>LED瓦楞灯</strong>优越品质<br />优质体验<br /><a href="led_sd_details.html">详细信息</a></li></ul></div><!--===============产品展示====================--><div id="main"><div class="main_left"><h3> 产品展示</h3><video src="https://via.placeholder.com/150" autoplay="autoplay" loop="loop" controls="controls"></video><div class="lianxi"><p><img src="https://via.placeholder.com/150" alt="" srcset="" >0633-3981234<br />400-180-6789</p><p><img src="https://via.placeholder.com/150" alt="">地址：山东省日照市学源路<br />科技工业园A区16号</p></div></div><!--===============企业新闻====================--><div class="main_center"><h3>企业新闻</h3><a href="news.html" target="_blank" class="more">MORE»</a><ul><li><a href="news_details.html">因智慧汽车的概念，ADB智能LED头灯系统发展迅速，ADB智能LED头灯兴起</a></li><span class="date">2018-03-30</span><li><a href="">LED灯具有 国内业务市场研讨会LED灯具国内业务。</a></li><span class="date">2018-03-03</span><li><a href="">车用、MiniLED等新产品助力，亿光&荣创看好业务运营服务工作。</a></li><span class="date">2018-03-03</span><li><a href="">OLED照明市场的机会与挑战-LEDinside</a></li><span class="date">2018-03-03</span><li><a href="">智能照明进入高速发展，工业及商业 为最大应用场景。</a></li><span class="date">2018-03-03</span></ul> </div><!--===============客户案例====================--><div class="main_right"><h3>客户案例</h3><a href="works.html" target="_blank" class="more">MORE»</a><div class="imgbox"><img src="https://via.placeholder.com/150" alt="" srcset="" /><hgroup><h3>日照水运基地</h3><h3>日照奥林匹克水上公园</h3><h3>日照水上运动中心夜景亮化</h3></hgroup></div><ul><li><a href="">乌海政府亮化工程 --2016年7月完工，美丽的城市。</a></li><li><a href="">夜景亮化工程公司 --美丽一座城市的夜晚。</a></li><li><a href="">小区数码管亮化工程 --方便大家出行。</a></li><li><a href="">水世界楼体亮化 --旅游盛景，等你欣赏美景。</a></li><li><a href="">开发区委会夜景亮化 --2018年3月完工。</a></li></ul></div></div></div><!--===============页尾====================--><footer><p class="link"><a href="index.html">网页首页</a>|<a href="products.html">产品中心</a>|<a href="connect.html">联系方式</a>|<a href="news.html">新闻动态</a></p><p>地址：山东省日照市学院路 爱德照明科技有限公司</p></footer><div class="online_zx"><a href="#"><img src="https://via.placeholder.com/150" alt="" /></a></div></body>
</html>2、产品中心页面
代码：
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title>爱德照明网站首页</title><style>/*=========页面顶部样式===========*/*{margin: 0;padding: 0;box-sizing: border-box;}a{text-decoration: none;}body{width: 1050px;margin: 0 auto;font-family: "微软雅黑";font-size: 13px;color: #333;position: relative;}h3{font-size: 16px;color: #545861;font-weight: 500;}header{height: 250px;background-color: #FFFFEE;background-repeat: no-repeat;background-position: 50px;}.header-left{height: 50px;}.header-right{width: 250px;height: 50px;line-height: 50px;float: right;}.header-right img{width: 25px;height: 21px;}.header-right a:active,.header-right a:visited{text-decoration: none;color: #111111;}.header-right a:active,.header-right a:hover{color: blue;}.header-text{font-size: 40px;color: #4FAC00;margin-top: 10px;margin-left: 150px;}/*=========导航样式定义===========*/nav{margin-bottom:5px;height: 36px;background-image: linear-gradient(0deg,#9cf,#fff 60%,#9cf 100%);border-bottom: 1px solid #DBEAEE;}nav ul{list-style-type: none;}nav a{display: block;width: 90px;height: 36px;float: left;padding: 0px 8px 0px 8px;margin: 0 10px 0 20px;text-decoration: none;text-align: center;font-family: tahoma;font-size: 14px;font-weight: bold;}nav ul:nth-child(1)a{width: 50px;}nav ul li a:link,nav ul li a:visited{color: #333;}nav ul li a:active,nav ul li a:hover{color: #FFF;background-image: linear-gradient(0deg,#36c,#9CF 60%,#fff 100%);}/*=========网页中部内容样式===========*/#content{width: 1050px;height: auto;}/*=========热销产品列表样式===========*/footer {clear: both;height: 100px;background: #545861;border-bottom: 1px solid #fff;color: #ffffff;text-align: center;}footer :link {padding-top: 25px;}footer :link a {display: inline-block;width: 70px;height: 36px;color: #ffffff;padding: 0px 8px 0px 8px;margin: 0 14px 0 14px;text-decoration: none;text-align: center;}footer :link a:hover {color: #ccc;text-decoration: underline;}.online_zx {position: fixed;top: 30px;right: 10px;}/*=========左侧样式===========*/#content {width: 1050px;height: auto;}#content-left {width: 250px;height: auto;float: left;}#content-left ul {list-style: none;width: 250px;background: #fff;border-radius: 10px;margin: 0 auto;}#content-left ul li {width: 250px;height: 50px;margin-bottom: 1px;padding-left: 80px;background: #DDDDDD;font-size: 14px;line-height: 55px;text-align: left;}#content ul li a:link,#content-left ul li a:visited{color: #333;}#content-left ul li a:hover{color: #0091D8;}#content-left ul .tp {font-size: 18px;font-weight: 500;padding: 0px;text-align: center;width: 250px;height: 65px;line-height: 80px;background: #BBB;border-radius: 10px 0 0;}#content-left ul .yj {height: 20px;border-radius: 0 0 0 10px;margin-bottom: 5px;}#content-right {float: right;width: 800px;height: auto;}#content-right .tt {height: 40px;width: 785px;margin-left: 15px;border-bottom: 2px solid #D6D6D6;}#content-right h3 {font-weight: 500;font-size: 16px;border-bottom: 2px solid #0091D8;width: 90px;border-bottom: 10px 0 7px 5px;}#content-right #article {width: 800px;height: auto;}#content-right #article .products{width: 800px;}#article .products ul {list-style: none;}#article .products ul li {width: 180px;height: 210px;float: left;margin: 10px;font-size: 14px;text-align: center;}#article .products ul li img {width: 180px;height: 180px;margin: 10px;}#article .products ul li a:hover {color: #0091D8;}#article .products ul li a:hover img {border: 2px solid #0091D8;}</style></head><body><header><!--===============占位符图片===================--><img class="header-left" src="https://via.placeholder.com/150" alt="Placeholder Image"><div class="header-right"><a href="#"><img src="https://via.placeholder.com/150" alt="" srcset="" />官方微信</a> <span style="color: #930;">|</span><a href="login.html">管理员登录</a> <span style="color: #930;">|</span><a href="register.html">会员注册</a> <span style="color: #930;">|</span></div><div class="header-text">照明材料</div></header><!--===================横向导航栏======================--><nav><ul><li><a href="index.html">首页</a></li><li><a href="products.html">产品中心</a></li><li><a href="works.html">工程案例</a></li><li><a href="news.html">新闻动态</a></li><li><a href="about.html">招商加盟</a></li><li><a href="connect.html">联系我们</a></li></ul></nav><!--==================内容区域=====================--><div id="content"><aside id="content-left"><ul><li class="tp">产品中心</li><li><a href="">LED景观路灯</a> <img src="https://via.placeholder.com/150" alt="" /></li><li><a href="">LED射灯</a></li><li><a href="">LED映红灯</a></li><li><a href="">LED瓦楞灯</a></li><li><a href="">LED数码灯</a></li><li><a href="">LED点光源</a></li><li><a href="">LED墙角灯</a></li><li class="yj"></li></ul></aside><div id="content-right"><div class="tt"><h3>景观路灯</h3></div><div id="article"><div class="products"><ul><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br />仿古锥形广场灯柱</a></li><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br />多头造型LED景观灯</a></li><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br />镂空方柱形景观柱</a></li><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br />莲花造型广场景观灯柱</a></li><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br />内透光方柱景观灯</a></li><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br />现代园林庭院景观灯</a></li><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br />古典浮雕祥云景观灯柱</a></li><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br />立柱仿云石LED景观灯</a></li></ul></div></div></div></div><div class="page" style="clear: both;text-align: center;padding: 15px 0;"><hr><ul style="margin-top: 10px;"><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">«</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">‹</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">1</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">2</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">3</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">4</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">5</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">6</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">›</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">»</a></li></ul></div><!--===============页尾====================--><footer><p class="link"><a href="index.html">网页首页</a>|<a href="products.html">产品中心</a>|<a href="connect.html">联系方式</a>|<a href="news.html">新闻动态</a></p><p>地址：山东省日照市学院路 爱德照明科技有限公司</p></footer><div class="online_zx"><a href="#"><img src="https://via.placeholder.com/150" alt="" /></a></div></body></html>3、工程案例页面效果图
代码：
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title>爱德照明网站首页</title><style>/*=========页面顶部样式===========*/*{margin: 0;padding: 0;box-sizing: border-box;}a{text-decoration: none;}body{width: 1050px;margin: 0 auto;font-family: "微软雅黑";font-size: 13px;color: #333;position: relative;}h3{font-size: 16px;color: #545861;font-weight: 500;}header{height: 250px;background-color: #FFFFEE;background-repeat: no-repeat;background-position: 50px;}.header-left{height: 50px;}.header-right{width: 250px;height: 50px;line-height: 50px;float: right;}.header-right img{width: 25px;height: 21px;}.header-right a:active,.header-right a:visited{text-decoration: none;color: #111111;}.header-right a:active,.header-right a:hover{color: blue;}.header-text{font-size: 40px;color: #4FAC00;margin-top: 10px;margin-left: 150px;}/*=========导航样式定义===========*/nav{margin-bottom:5px;height: 36px;background-image: linear-gradient(0deg,#9cf,#fff 60%,#9cf 100%);border-bottom: 1px solid #DBEAEE;}nav ul{list-style-type: none;}nav a{display: block;width: 90px;height: 36px;float: left;padding: 0px 8px 0px 8px;margin: 0 10px 0 20px;text-decoration: none;text-align: center;font-family: tahoma;font-size: 14px;font-weight: bold;}nav ul:nth-child(1)a{width: 50px;}nav ul li a:link,nav ul li a:visited{color: #333;}nav ul li a:active,nav ul li a:hover{color: #FFF;background-image: linear-gradient(0deg,#36c,#9CF 60%,#fff 100%);}/*=========网页中部内容样式===========*/#content{width: 1050px;height: auto;}/*=========热销产品列表样式===========*/footer {clear: both;height: 100px;background: #545861;border-bottom: 1px solid #fff;color: #ffffff;text-align: center;}footer :link {padding-top: 25px;}footer :link a {display: inline-block;width: 70px;height: 36px;color: #ffffff;padding: 0px 8px 0px 8px;margin: 0 14px 0 14px;text-decoration: none;text-align: center;}footer :link a:hover {color: #ccc;text-decoration: underline;}.online_zx {position: fixed;top: 30px;right: 10px;}/*=========左侧样式===========*/#content {width: 1050px;height: auto;}#content-left {width: 250px;height: auto;float: left;}#content-left ul {list-style: none;width: 250px;background: #fff;border-radius: 10px;margin: 0 auto;}#content-left ul li {width: 250px;height: 50px;margin-bottom: 1px;padding-left: 80px;background: #DDDDDD;font-size: 14px;line-height: 55px;text-align: left;}#content ul li a:link,#content-left ul li a:visited{color: #333;}#content-left ul li a:hover{color: #0091D8;}#content-left ul .tp {font-size: 18px;font-weight: 500;padding: 0px;text-align: center;width: 250px;height: 65px;line-height: 80px;background: #BBB;border-radius: 10px 0 0;}#content-left ul .yj {height: 20px;border-radius: 0 0 0 10px;margin-bottom: 5px;}#content-right {float: right;width: 800px;height: auto;}#content-right .tt {height: 40px;width: 785px;margin-left: 15px;border-bottom: 2px solid #D6D6D6;}#content-right h3 {font-weight: 500;font-size: 16px;border-bottom: 2px solid #0091D8;width: 90px;border-bottom: 10px 0 7px 5px;}#content-right #article {width: 800px;height: auto;}#content-right #article .products{width: 800px;}#article .products ul {list-style: none;}#article .products ul li {width: 180px;height: 210px;float: left;margin: 10px;font-size: 14px;text-align: center;}#article .products ul li img {width: 180px;height: 180px;margin: 10px;}#article .products ul li a:hover {color: #0091D8;}#article .products ul li a:hover img {border: 2px solid #0091D8;}</style></head><body><header><!--===============占位符图片===================--><img class="header-left" src="https://via.placeholder.com/150" alt="Placeholder Image"><div class="header-right"><a href="#"><img src="https://via.placeholder.com/150" alt="" srcset="" />官方微信</a> <span style="color: #930;">|</span><a href="login.html">管理员登录</a> <span style="color: #930;">|</span><a href="register.html">会员注册</a> <span style="color: #930;">|</span></div><div class="header-text">照明材料</div></header><!--===================横向导航栏======================--><nav><ul><li><a href="index.html">首页</a></li><li><a href="companyfile.html">关于我们</a></li><li><a href="products.html">产品中心</a></li><li><a href="works.html">工程案例</a></li><li><a href="news.html">新闻动态</a></li><li><a href="about.html">招商加盟</a></li><li><a href="contact.html">联系我们</a></li></ul></nav><!--==================内容区域=====================--><div id="content"><aside id="content-left"><ul><li class="tp">工程案例</li><li><a href="worls_detail.html">客户案例</a> <img src="https://via.placeholder.com/150" alt="" /></li><li><a href="">数码灯案例</a></li><li><a href="">西培灯案例</a></li><li><a href="">墙角灯案例</a></li><li class="yj"></li></ul></aside><div id="content-right"><div class="tt"><h3>客户案例</h3></div><div id="article"><div class="products"><ul><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br />英伦风格商场亮化工程夜景<dd style="color: #333;font-size: 11px;position: relative;width: 250px;left: -25px;opacity: 0.4;">施工时间 2015-03-21 投资 ￥12.35万</dd></a></li><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br /><p style="margin-left: -10px;">内蒙古广场夜景亮化工程</p><dd style="color: #333;font-size: 11px;position: relative;width: 250px;left: -22px;opacity: 0.4;">施工时间 2015-03-21 投资 ￥12.35万</dd></a></li><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br /><p style="margin-left: -50px;">七天酒店亮化工程</p><dd style="color: #333;font-size: 11px;position: relative;width: 250px;left: -30px;opacity: 0.4;">施工时间 2015-08-6 投资 ￥8.73万</dd></a></li><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br /><p style="margin-left: -50px;">奥林匹克亮化工程</p><dd style="color: #333;font-size: 11px;position: relative;width: 250px;left: -30px;opacity: 0.4;">施工时间 2008-08-1 投资 ￥8.73万</dd></a></li><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br /><p style="margin-left: -40px;">城市步行街夜景亮化</p><dd style="color: #333;font-size: 11px;position: relative;width: 250px;left: -25px;opacity: 0.4;">施工时间 2015-06-21 投资 ￥11.03万</dd></a></li><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br /><p style="margin-left: -20px;">长乐首席观江豪宅亮化</p><dd style="color: #333;font-size: 11px;position: relative;width: 250px;left: -25px;opacity: 0.4;">施工时间 2018-01-6 投资 ￥7.32万</dd></a></li><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br /><p style="margin-left: -35px;">城市公园景观灯夜景</p><dd style="color: #333;font-size: 11px;position: relative;width: 250px;left: -25px;opacity: 0.4;">施工时间 2017-07-04 投资 ￥4.17万</dd></a></li><li><a href=""><img src="https://via.placeholder.com/150" alt="" srcset="" ><br /><p style="margin-left: -20px;">智能家庭LED射灯亮化</p><dd style="color: #333;font-size: 11px;position: relative;width: 250px;left: -25px;opacity: 0.4;">施工时间 2022-01-6 投资 ￥17.32万</dd></a></li></ul></div></div></div></div><div class="page" style="clear: both;text-align: center;padding: 15px 0;"><hr><ul style="margin-top: 10px;"><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">«</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">‹</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">1</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">2</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">3</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">4</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">5</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">6</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">›</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">»</a></li></ul></div><!--===============页尾====================--><footer><p class="link"><a href="index.html">网页首页</a>|<a href="products.html">产品中心</a>|<a href="contact.html">联系方式</a>|<a href="news.html">新闻动态</a></p><p>地址：山东省日照市学院路 爱德照明科技有限公司</p></footer><div class="online_zx"><a href="#"><img src="https://via.placeholder.com/150" alt="" /></a></div></body></html>4、新闻页面效果图：
代码：
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title>爱德照明网站首页</title><style>/*=========外部样式===========*/@charset "utf-8";*{margin: 0;padding: 0;box-sizing: border-box;}a{text-decoration: none;}@font-face{font-family: 'iconfont';src: url('../fonts/iconfont.ttf');}body{width: 1050px;margin: 0 auto;font-family: "微软雅黑";font-size: 13px;color: #333;position: relative;}h3{font-size: 16px;color: #545861;font-weight: 500;}h4{font-size: 14px;}h5{font-size:13px;}/*=========页面顶部样式===========*/header{height: 250px;background-color: #FFFFEE;background-repeat: no-repeat;background-position: 50px;}.header-left{height: 50px;}.header-right{width: 250px;height: 50px;line-height: 50px;float: right;}.header-right img{width: 25px;height: 21px;}.header-right a:active,.header-right a:visited{text-decoration: none;color: #111111;}.header-right a:active,.header-right a:hover{color: blue;}.header-text{font-size: 40px;color: #4FAC00;margin-top: 10px;margin-left: 150px;}/*=========导航样式定义===========*/nav{margin-bottom:5px;height: 36px;background-image: linear-gradient(0deg,#9cf,#fff 60%,#9cf 100%);border-bottom: 1px solid #DBEAEE;}nav ul{list-style-type: none;}nav a{display: block;width: 90px;height: 36px;float: left;padding: 0px 8px 0px 8px;margin: 0 10px 0 20px;text-decoration: none;text-align: center;font-family: tahoma;font-size: 14px;font-weight: bold;}nav ul:nth-child(1)a{width: 50px;}nav ul li a:link,nav ul li a:visited{color: #333;}nav ul li a:active,nav ul li a:hover{color: #FFF;background-image: linear-gradient(0deg,#36c,#9CF 60%,#fff 100%);}/*=========网页中部内容样式===========*/#content{width: 1050px;height: auto;}/*=========热销产品列表样式===========*/footer {clear: both;height: 100px;background: #545861;border-bottom: 1px solid #fff;color: #ffffff;text-align: center;}footer :link {padding-top: 25px;}footer :link a {display: inline-block;width: 70px;height: 36px;color: #ffffff;padding: 0px 8px 0px 8px;margin: 0 14px 0 14px;text-decoration: none;text-align: center;}footer :link a:hover {color: #ccc;text-decoration: underline;}.online_zx {position: fixed;top: 30px;right: 10px;}/*=========左侧样式===========*/#content-left{width: 250px;height: auto;float: left;}#content-left ul {list-style: none;width: 250px;background: #fff;border-radius: 10px;margin: 0 auto;}#content-left ul li {width: 250px;height: 50px;margin-bottom: 1px;padding-left: 80px;background: #DDDDDD;font-size: 14px;line-height: 55px;text-align: left;}#content-left ul li a :link,#content-left ul li a :visited {color: #333;}#content-left ul li a:hover{color: #0091D8;}#content-left ul .tp {font-size: 18px;font-weight: 500;padding: 0;text-align: center;width: 250px;height: 65px;line-height: 80px;background: #BBB;border-radius: 10px 0 0;}#content-left ul .yj {height: 20px;border-radius: 0 0 0 10px;margin-bottom: 5px;}#content-right {float: right;width: 800px;height: auto;}#content-right .tt {height: 40px;width: 785px;margin-left: 15px;border-bottom: 2px solid #D6D6D6;}#content-right h3 {font-weight: 500;font-size: 16px;border-bottom: 2px solid #0091D8;width: 90px;padding: 10px 0 7px 5px;}#content-right #article{width: 800px;height: auto;}#article .news {width: 780px;height: auto;margin: 20px 0 20px 20px;}#article .news ul{list-style: none;}#article .news ul li {width: 780px;height: 30px;float: left;margin: 5px;border-bottom: 1px dotted #999999;}#article .news ul li:before {margin-right: 5px;}#article .news ul li:nth-last-child(1){border-bottom: 0px;}#article .news ul li a:link,a:valid{text-decoration: none;color: #494949;}#article .news ul li a:hover{color: #0091D8;}#article .page a:hover {background-color: #DDD;}</style></head><body><header><!--===============占位符图片===================--><img class="header-left" src="https://via.placeholder.com/150" alt="Placeholder Image"><div class="header-right"><a href="#"><img src="https://via.placeholder.com/150" alt="" srcset="" />官方微信</a> <span style="color: #930;">|</span><a href="login.html">管理员登录</a> <span style="color: #930;">|</span><a href="register.html">会员注册</a> <span style="color: #930;">|</span></div><div class="header-text">照明材料</div></header><!--===================横向导航栏======================--><nav><ul><li><a href="index.html">首页</a></li><li><a href="products.html">产品中心</a></li><li><a href="works.html">工程案例</a></li><li><a href="news.html">新闻动态</a></li><li><a href="about.html">招商加盟</a></li><li><a href="contact.html">联系我们</a></li></ul></nav><!--==================内容区域=====================--><div id="content"><aside id="content-left"><ul><li class="tp">新闻动态</li><li><a href="news.html">公司新闻 <img src="https://via.placeholder.com/150" alt="" /></a></li><li><a href="news_proinfo.html">产品资讯</a></li><li class="yj"></li></ul></aside><!--===============公司新闻====================--><div id="content-right"><div class="tt"><h3>公司新闻</h3></div><div id="article"><div class="news"><ul><li><a href="news_detail.html">因应智慧汽车概念：ADB智能LED头灯系统发展迅速，ADB智能LED头灯兴起。</a></li><span class="date" style="float: right;margin-right: 10px;">2018-03-30</span><li><a href="">LED灯具国内业务市场研讨会LED灯具有国内业务2017-4-6</a></li><span class="date" style="float: right;margin-right: 10px;">2018-03-23</span><li><a href="">车用、MiniLED等新产品助力，亿光荣创看好营运服务工作。</a></li><span class="date" style="float: right;margin-right: 10px;">2018-03-19</span><li><a href="">OLED照明市场的机会与挑战 -- LEDinside</a></li><span class="date" style="float: right;margin-right: 10px;">2018-03-16</span><li><a href="">江苏加快半导体照明产业发展，2020年规模将达1200亿。</a></li><span class="date" style="float: right;margin-right: 10px;">2018-02-28</span><li><a href="">智能照明进入高速发展，工业及商业为最大应用场景。</a></li><span class="date" style="float: right;margin-right: 10px;">2018-02-21</span><li><a href="">景观坝LED洗墙灯怎么选购？您不能忽略这些细节！</a></li><span class="date" style="float: right;margin-right: 10px;">2018-02-18</span><li><a href="">LED点光灯源的线路板使用什么材质质量最好？</a></li><span class="date" style="float: right;margin-right: 10px;">2018-02-13</span><li><a href="">智能照明进入高速发展，工业及商业为最大应用场景。</a></li><span class="date"style="float: right;margin-right: 10px;">2018-03-08</span></ul></div></div></div>
<!--===============分页器====================--> <div class="page" style="clear: both;text-align: center;padding: 15px 0;"><hr><ul style="margin-top: 10px;"><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">«</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">‹</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">1</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">2</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">3</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">4</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">5</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">6</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">›</a></li><li style="display: inline;"><a href="" style="display: inline-block;width: 20px;border: 1px solid #0091D8;font-size: 14px;text-align: center;line-height: 20px;border-radius: 50%;">»</a></li></ul></div></div></div><!--===============页尾====================--><footer><p class="link"><a href="index.html">网页首页</a>|<a href="products.html">产品中心</a>|<a href="connect.html">联系方式</a>|<a href="news.html">新闻动态</a></p><p>地址：山东省日照市学院路 爱德照明科技有限公司</p></footer><div class="online_zx"><a href="#"><img src="https://via.placeholder.com/150" alt="" /></a></div></body>
</html>5、联系我们页面效果图
代码：
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title>爱德照明网站首页</title><style>/*=========外部样式===========*/@charset "utf-8";*{margin: 0;padding: 0;box-sizing: border-box;}a{text-decoration: none;}@font-face{font-family: 'iconfont';src: url('../fonts/iconfont.ttf');}body{width: 1050px;margin: 0 auto;font-family: "微软雅黑";font-size: 13px;color: #333;position: relative;}h3{font-size: 16px;color: #545861;font-weight: 500;}h4{font-size: 14px;}h5{font-size:13px;}/*=========页面顶部样式===========*/header{height: 250px;background-color: #FFFFEE;background-repeat: no-repeat;background-position: 50px;}.header-left{height: 50px;}.header-right{width: 250px;height: 50px;line-height: 50px;float: right;}.header-right img{width: 25px;height: 21px;}.header-right a:active,.header-right a:visited{text-decoration: none;color: #111111;}.header-right a:active,.header-right a:hover{color: blue;}.header-text{font-size: 40px;color: #4FAC00;margin-top: 10px;margin-left: 150px;}/*=========导航样式定义===========*/nav{margin-bottom:5px;height: 36px;background-image: linear-gradient(0deg,#9cf,#fff 60%,#9cf 100%);border-bottom: 1px solid #DBEAEE;}nav ul{list-style-type: none;}nav a{display: block;width: 90px;height: 36px;float: left;padding: 0px 8px 0px 8px;margin: 0 10px 0 20px;text-decoration: none;text-align: center;font-family: tahoma;font-size: 14px;font-weight: bold;}nav ul:nth-child(1)a{width: 50px;}nav ul li a:link,nav ul li a:visited{color: #333;}nav ul li a:active,nav ul li a:hover{color: #FFF;background-image: linear-gradient(0deg,#36c,#9CF 60%,#fff 100%);}/*=========网页中部内容样式===========*/#content{width: 1050px;height: auto;}/*=========热销产品列表样式===========*/footer {clear: both;height: 100px;background: #545861;border-bottom: 1px solid #fff;color: #ffffff;text-align: center;}footer :link {padding-top: 25px;}footer :link a {display: inline-block;width: 70px;height: 36px;color: #ffffff;padding: 0px 8px 0px 8px;margin: 0 14px 0 14px;text-decoration: none;text-align: center;}footer :link a:hover {color: #ccc;text-decoration: underline;}.online_zx {position: fixed;top: 30px;right: 10px;}/*=========左侧样式===========*/#content .contact {width: 1050px;height: auto;margin: 20px 0 20px 0px;}#content .contact h3 {font-size: 16px;font-weight: 500;margin: 20px 0 10px 5px;}#content .contact img {width: 550px;height: 400px;float: left;margin: 10px 30px 10px 0;border: 1px solid #D6D6D6;}#content .contact h4 {font-size: 14px;font-weight: 800;margin: 30px 0 10px 30px;}#content .contact p {text-indent: 2em;}</style></head><body><header><!--===============占位符图片===================--><img class="header-left" src="https://via.placeholder.com/150" alt="Placeholder Image"><div class="header-right"><a href="#"><img src="https://via.placeholder.com/150" alt="" srcset="" />官方微信</a> <span style="color: #930;">|</span><a href="login.html">管理员登录</a> <span style="color: #930;">|</span><a href="register.html">会员注册</a> <span style="color: #930;">|</span></div><div class="header-text">照明材料</div></header><!--===================横向导航栏======================--><nav><ul><li><a href="index.html">首页</a></li><li><a href="products.html">产品中心</a></li><li><a href="works.html">工程案例</a></li><li><a href="news.html">新闻动态</a></li><li><a href="about.html">招商加盟</a></li><li><a href="connect.html">联系我们</a></li></ul></nav><!--==================内容区域=====================--><div id="content"><div class="contact"><h3>CONTACT联系我们</h3><hr color="#D6D6D6" size="3" width="100%" align="center"/><img src="https://via.placeholder.com/150" alt="" /><h4>联系电话：</h4><p>0633-3981234</p><p>0633-3981235</p><h4>传真：</h4><p>0633-3961234</p><h4>通信地址：</h4><p>山东省日照市学院路 科技工业园A区16号</p><p>邮编：276826</p></div><!--===============页尾====================--><footer><p class="link"><a href="index.html">网页首页</a>|<a href="products.html">产品中心</a>|<a href="connect.html">联系方式</a>|<a href="news.html">新闻动态</a></p><p>地址：山东省日照市学院路 爱德照明科技有限公司</p></footer><div class="online_zx"><a href="#"><img src="https://via.placeholder.com/150" alt="" /></a></div></body><script type="text/javascript"src="https://webapi.amap.com/maps?v=1.4.8&key=d1d488592fbee456f8a48033f59f7cd2"></script><script></script>
</html>登陆注册页面效果图：
代码：
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>登录</title><style>body{font-size: 13px;font-family: "微软雅黑";}body,form,input,h1,p{padding: 0;margin: 0;border: 0;}#bg{width: 100%;height: 750px;background: linear-gradient(to right, rgba(255,255,255,0),rgba(255,255,255,0) 30%,rgba(255,255,255,1)),url("img/single-page-header.jpg");background-size: cover;background-position: center;}form {width: 450px;height: 600px;position: absolute;right: 8%;top: 4%;}h2{width: 400px;text-align: center;margin: 25px 0;font-weight: 600;}p{margin-top: 20px;}p span {width: 75px;display: inline-block;text-align: right;padding-right: 10px;}p input{width: 200px;height: 18px;border: 1px solid #d4cdba;padding: 2px;}.btn input {width: 70px;height: 25px;border: 1px solid #AAA;background: #DDD;margin-top: 15px;margin-left: 80px;border-radius: 3px;font-size: 13px;font-family: "微软雅黑";color: #111;}</style></head><body><div id="bg"><form action="#" method="get" autocomplete="0ff"><h2>会员注册</h2><p><span>登录名：</span><input type="text" name="user_name" placeholder="姓名" required/>（必填）</p><p><span>密 码：</span><input type="password" name="user_pwd" value="" required/>(必填，不能少于8位)</p><p><span>确认密码：</span><input type="password" name="pwdl" value="" required />(必填，不能少于8位)</p><p><span>真实姓名：</span><input type="text" name="real_name" pattern="^[\u4e00-\u9fa5]{0,}$" required />(必填，只能输入汉字)</p><p><span>真实年龄：</span><input type="number" name="real_age" value="24" min="15" max="120" required/>(必填)</p><p><span>出生日期：</span><input type="date" name="birthday" value="1990-10-1" required/>(必填)</p><p><span>电子邮箱：</span><input type="email" name="myemail" placeholder="name@163.com" required multiple/>(必填)</p><p><span>身份证号：</span><input type="text" name="card" required pattern="^d{8,18}{0-9x}{8,18}{0-9X}{8,18}?&"/>(必填：18位身份证号)</p><p><span>手机号码：</span><input type="tel" name="telphone" pattern="^\d{11}$" required>(必填)</p><p><span>个人主页：</span><input type="url" name="myurl" list="urllist" placeholder="http://www.sdwrp.com" pattern="http://([w-]+\.)+[\w-]+(/[\w-./?%&=])"/>请选择网址<datalist id="urlist"><option>http://www.sdwrp.com</option><option>http://www.baidu.com</option><option>http://www.w3school.com.cn</option></datalist></p><p class="btn"><input type="submit" value="提交"/><input type="reset" value="重置"/></p></form></div></body>
</html>6、客户案例页效果图：
代码：
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title>爱德照明网站首页</title><style>/*=========页面顶部样式===========*/*{margin: 0;padding: 0;box-sizing: border-box;}a{text-decoration: none;}body{width: 1050px;margin: 0 auto;font-family: "微软雅黑";font-size: 13px;color: #333;position: relative;}h3{font-size: 16px;color: #545861;font-weight: 500;}header{height: 250px;background-color: #FFFFEE;background-repeat: no-repeat;background-position: 50px;}.header-left{height: 50px;}.header-right{width: 250px;height: 50px;line-height: 50px;float: right;}.header-right img{width: 25px;height: 21px;}.header-right a:active,.header-right a:visited{text-decoration: none;color: #111111;}.header-right a:active,.header-right a:hover{color: blue;}.header-text{font-size: 40px;color: #4FAC00;margin-top: 10px;margin-left: 150px;}/*=========导航样式定义===========*/nav{margin-bottom:5px;height: 36px;background-image: linear-gradient(0deg,#9cf,#fff 60%,#9cf 100%);border-bottom: 1px solid #DBEAEE;}nav ul{list-style-type: none;}nav a{display: block;width: 90px;height: 36px;float: left;padding: 0px 8px 0px 8px;margin: 0 10px 0 20px;text-decoration: none;text-align: center;font-family: tahoma;font-size: 14px;font-weight: bold;}nav ul:nth-child(1)a{width: 50px;}nav ul li a:link,nav ul li a:visited{color: #333;}nav ul li a:active,nav ul li a:hover{color: #FFF;background-image: linear-gradient(0deg,#36c,#9CF 60%,#fff 100%);}/*=========网页中部内容样式===========*/#content{width: 1050px;height: auto;}/*=========热销产品列表样式===========*/footer {clear: both;height: 100px;background: #545861;border-bottom: 1px solid #fff;color: #ffffff;text-align: center;}footer :link {padding-top: 25px;}footer :link a {display: inline-block;width: 70px;height: 36px;color: #ffffff;padding: 0px 8px 0px 8px;margin: 0 14px 0 14px;text-decoration: none;text-align: center;}footer :link a:hover {color: #ccc;text-decoration: underline;}.online_zx {position: fixed;top: 30px;right: 10px;}/*=========左侧样式===========*/#content {width: 1050px;height: auto;}#content-left {width: 250px;height: auto;float: left;}#content-left ul {list-style: none;width: 250px;background: #fff;border-radius: 10px;margin: 0 auto;}#content-left ul li {width: 250px;height: 50px;margin-bottom: 1px;padding-left: 80px;background: #DDDDDD;font-size: 14px;line-height: 55px;text-align: left;}#content ul li a:link,#content-left ul li a:visited{color: #333;}#content-left ul li a:hover{color: #0091D8;}#content-left ul .tp {font-size: 18px;font-weight: 500;padding: 0px;text-align: center;width: 250px;height: 65px;line-height: 80px;background: #BBB;border-radius: 10px 0 0;}#content-left ul .yj {height: 20px;border-radius: 0 0 0 10px;margin-bottom: 5px;}#content-right {float: right;width: 800px;height: auto;}#content-right .tt {height: 40px;width: 785px;margin-left: 15px;border-bottom: 2px solid #D6D6D6;}#content-right h3 {font-weight: 500;font-size: 16px;border-bottom: 2px solid #0091D8;width: 90px;border-bottom: 10px 0 7px 5px;}#content-right #article {width: 800px;height: auto;}#content-right #article .products{width: 800px;}#article .products ul {list-style: none;}#article .products ul li {width: 180px;height: 210px;float: left;margin: 10px;font-size: 14px;text-align: center;}#article .products ul li img {width: 180px;height: 180px;margin: 10px;}#article .products ul li a:hover {color: #0091D8;}#article .products ul li a:hover img {border: 2px solid #0091D8;}#imagePopup {display: none;position: fixed;z-index: 9999;left: 0;top: 0;width: 100%;height: 100%;overflow: auto;background-color: rgba(0,0,0,0.8);}#imagePopup img {margin: auto;display: block;max-width: 100%;max-height: 100%;background-position: center;margin-top: 300px;}.closePopup {color: #fff;float: right;font-size: 28px;font-weight: bold;cursor: pointer;padding: 10px;}.closePopup:hover {color: #ccc;}.content_center {display: flex;flex-wrap: wrap;justify-content: center;}.content_center img {margin: 10px;cursor: pointer;}</style></head><body><header><!--===============占位符图片===================--><img class="header-left" src="https://via.placeholder.com/150" alt="Placeholder Image"><div class="header-right"><a href="#"><img src="https://via.placeholder.com/150" alt="" srcset="" />官方微信</a> <span style="color: #930;">|</span><a href="login.html">管理员登录</a> <span style="color: #930;">|</span><a href="register.html">会员注册</a> <span style="color: #930;">|</span></div><div class="header-text">照明材料</div></header><!--===================横向导航栏======================--><nav><ul><li><a href="index.html">首页</a></li><li><a href="companyfile.html">关于我们</a></li><li><a href="products.html">产品中心</a></li><li><a href="works.html">工程案例</a></li><li><a href="news.html">新闻动态</a></li><li><a href="about.html">招商加盟</a></li><li><a href="contact.html">联系我们</a></li></ul></nav><!--==================内容区域=====================--><div id="content"><aside id="content-left"><ul><li class="tp">工程案例</li><li><a href="">客户案例</a> <img src="https://via.placeholder.com/150" alt="" /></li><li><a href="">数码灯案例</a></li><li><a href="">西培灯案例</a></li><li><a href="">墙角灯案例</a></li><li class="yj"></li></ul></aside><div id="content-right"><div class="tt"><h3>客户案例</h3></div><h2 style="font-weight: 500;margin-left: 35px;font-size: 15px;margin-top: 20px;">灯光表现力主要作用：</h2><div id="article"><p style="margin-left: 35px;margin-top: 4px;">1、加工空间艺术：利用灯光的表现力对环境空间进行艺术加工，满足了人们对视觉的需求，得到美的享受和视觉平衡。</p><p style="margin-left: 35px;margin-top: 4px;">2、物体造型渲染：利用灯光对广场建筑和物体造型的渲染，以利用灯光作出廊画等，发挥丰富的艺术效果。</p><p style="margin-left: 35px;margin-top: 4px;">3、丰富空间内容：通过明暗对比，在一片环境宽度较低的背景中出现即视效应，增加空间层次，吸引人们视觉注意力。</p><p style="margin-left: 35px;margin-top: 4px;">4、装饰空间艺术：通过自身的造型，质感以及灯具排列组合对空间起点强化艺术效果的作用。</p></div><div class="content_center" style="margin-top: 20px;margin-left: -125px;width: 1050px;"><img src="https://via.placeholder.com/150" alt="" srcset="" onclick="showImagePopup(this.src)" style="width: 130px; height: 130px;"/><img src="https://via.placeholder.com/150" alt="" srcset="" onclick="showImagePopup(this.src)" style="width: 130px; height: 130px;"/><img src="https://via.placeholder.com/150" alt="" srcset="" onclick="showImagePopup(this.src)" style="width: 130px; height: 130px;"/><img src="https://via.placeholder.com/150" alt="" srcset="" onclick="showImagePopup(this.src)" style="width: 130px; height: 130px;"/><img src="https://via.placeholder.com/150" alt="" srcset="" onclick="showImagePopup(this.src)" style="width: 130px; height: 130px;"/></div><div id="imagePopup"><span class="closePopup" onclick="closeImagePopup()">×</span><img id="popupImage" src="" alt="" srcset="" /></div></div></div><!--===============页尾====================--><footer><p class="link"><a href="index.html">网页首页</a>|<a href="products.html">产品中心</a>|<a href="contact.html">联系方式</a>|<a href="news.html">新闻动态</a></p><p>地址：山东省日照市学院路 爱德照明科技有限公司</p></footer><div class="online_zx"><a href="#"><img src="https://via.placeholder.com/150" alt="" /></a></div></body><script>function showImagePopup(src) {var popup = document.getElementById("imagePopup");var image = document.getElementById("popupImage");image.src = src;popup.style.display = "block";}function closeImagePopup() {var popup = document.getElementById("imagePopup");popup.style.display = "none";}</script>
</html>弹出层效果图：
7、公司简介页面效果图：
代码：
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title>爱德照明网站首页</title><style>/*=========页面顶部样式===========*/*{margin: 0;padding: 0;box-sizing: border-box;}a{text-decoration: none;}body{width: 1050px;margin: 0 auto;font-family: "微软雅黑";font-size: 13px;color: #333;position: relative;}h3{font-size: 16px;color: #545861;font-weight: 500;}header{height: 250px;background-color: #FFFFEE;background-repeat: no-repeat;background-position: 50px;}.header-left{height: 50px;}.header-right{width: 250px;height: 50px;line-height: 50px;float: right;}.header-right img{width: 25px;height: 21px;}.header-right a:active,.header-right a:visited{text-decoration: none;color: #111111;}.header-right a:active,.header-right a:hover{color: blue;}.header-text{font-size: 40px;color: #4FAC00;margin-top: 10px;margin-left: 150px;}/*=========导航样式定义===========*/nav{margin-bottom:5px;height: 36px;background-image: linear-gradient(0deg,#9cf,#fff 60%,#9cf 100%);border-bottom: 1px solid #DBEAEE;}nav ul{list-style-type: none;}nav a{display: block;width: 90px;height: 36px;float: left;padding: 0px 8px 0px 8px;margin: 0 10px 0 20px;text-decoration: none;text-align: center;font-family: tahoma;font-size: 14px;font-weight: bold;}nav ul:nth-child(1)a{width: 50px;}nav ul li a:link,nav ul li a:visited{color: #333;}nav ul li a:active,nav ul li a:hover{color: #FFF;background-image: linear-gradient(0deg,#36c,#9CF 60%,#fff 100%);}/*=========网页中部内容样式===========*/#content{width: 1050px;height: auto;}/*=========热销产品列表样式===========*/footer {clear: both;height: 100px;background: #545861;border-bottom: 1px solid #fff;color: #ffffff;text-align: center;}footer :link {padding-top: 25px;}footer :link a {display: inline-block;width: 70px;height: 36px;color: #ffffff;padding: 0px 8px 0px 8px;margin: 0 14px 0 14px;text-decoration: none;text-align: center;}footer :link a:hover {color: #ccc;text-decoration: underline;}.online_zx {position: fixed;top: 30px;right: 10px;}/*=========左侧样式===========*/#content {width: 1050px;height: auto;}#content-left {width: 250px;height: auto;float: left;}#content-left ul {list-style: none;width: 250px;background: #fff;border-radius: 10px;margin: 0 auto;}#content-left ul li {width: 250px;height: 50px;margin-bottom: 1px;padding-left: 80px;background: #DDDDDD;font-size: 14px;line-height: 55px;text-align: left;}#content ul li a:link,#content-left ul li a:visited{color: #333;}#content-left ul li a:hover{color: #0091D8;}#content-left ul .tp {font-size: 18px;font-weight: 500;padding: 0px;text-align: center;width: 250px;height: 65px;line-height: 80px;background: #BBB;border-radius: 10px 0 0;}#content-left ul .yj {height: 20px;border-radius: 0 0 0 10px;margin-bottom: 5px;}#content-right {float: right;width: 800px;height: auto;}#content-right .tt {height: 40px;width: 785px;margin-left: 15px;border-bottom: 2px solid #D6D6D6;}#content-right h3 {font-weight: 500;font-size: 16px;border-bottom: 2px solid #0091D8;width: 90px;border-bottom: 10px 0 7px 5px;}#content-right #article {width: 800px;height: auto;}.tt p{font-family: Tahoma;color: #444;text-align: left;font-size: 13px;line-height: 24px;text-indent: 2em;margin: 5px;}</style></head><body><header><!--===============占位符图片===================--><img class="header-left" src="https://via.placeholder.com/150" alt="Placeholder Image"><div class="header-right"><a href="#"><img src="https://via.placeholder.com/150" alt="" srcset="" />官方微信</a> <span style="color: #930;">|</span><a href="login.html">管理员登录</a> <span style="color: #930;">|</span><a href="register.html">会员注册</a> <span style="color: #930;">|</span></div><div class="header-text">照明材料</div></header><!--===================横向导航栏======================--><nav><ul><li><a href="index.html">首页</a></li><li><a href="">关于我们</a></li><li><a href="products.html">产品中心</a></li><li><a href="works.html">工程案例</a></li><li><a href="news.html">新闻动态</a></li><li><a href="about.html">招商加盟</a></li><li><a href="contact.html">联系我们</a></li></ul></nav><!--=================内容区域===================--><div id="content"><aside id="content-left"><ul><li class="tp">关于我们</li><li><a href="">公司简介</a> <img src="https://via.placeholder.com/150" alt="" /></li><li><a href="honner.html">公司荣誉</a></li><li><a href="history.html">发展历程</a></li><li><a href="team.html">企业团队</a></li><li><a href="cuture.html">企业文化</a></li><li><a href="encormainls.html">公司环境</a></li><li class="yj"></li></ul></aside><div id="content-right"><div class="tt"><h3>公司简介</h3><p style="margin-top: 30px;">公司成立于2008年，是一家专业照明亮化工程公司，公司拥有国家一级工程施工资质，同时也是一家集市政路灯、户外亮化、照明工程设计、LED室内外灯销售及施工为一体的大型专业话“照明工程"公司。</p><p style="position: relative;top: -5px;">公司现有员工中专及以上学历的占66.9%，中级工程师占32.8%，高级工程师占11.2%。现已形成一只技术精湛，富有敬业，创新精确的专业型人才队伍。是中国照明行业，城市及道路专业施工一级资质的企业，能为客户提供独具匠心的照明设计，环保节能的产品配置，经济实惠的造价理念，一战式美化照明解决方案和完善的售后服务保障。</p><p style="position: relative;top: -10px;">公司在员工的不懈努力和社会各界的支持下，经过7年多的发展，已由普通的城市及道路照明三级资质晋升为中国一级施工企业。公司严格遵守ISO9001质量保证体系，荣获全国照明行业“AAA级施工单位”、“质量优”、“信誉好先进单位”、“质量信的过单位”等等，是“政府采购”首选优良工程施工单位，是中国照明电器协会会员单位，同时也是中国照明电器协会LED生产专业委员会委员。</p><p style="position: relative;top: -15px;">公司立于广州中山，辐射全国，是LED照明、LED景观美化、LED显示屏、太阳能照明、风能照明、风光两能照明、光导照明、光纤照明及补光照明工程公司，做中国照明行业一流企业是我们的目标，在今后的企业发展道路上，用我们的专业照明技术为智慧城市及道路照明的节能环保，创造舒适的环境。</p></div></div><!--===============页尾====================--><footer style="position: relative;top: 30px;"><p class="link"><a href="index.html">网页首页</a>|<a href="products.html">产品中心</a>|<a href="contact.html">联系方式</a>|<a href="news.html">新闻动态</a></p><p>地址：山东省日照市学院路 爱德照明科技有限公司</p></footer><div class="online_zx"><a href="#"><img src="https://via.placeholder.com/150" alt="" /></a></div></body><script></script>
</html>9、公司荣誉页面效果图：
代码：
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title>爱德照明网站首页</title><style>/*=========页面顶部样式===========*/*{margin: 0;padding: 0;box-sizing: border-box;}a{text-decoration: none;}body{width: 1050px;margin: 0 auto;font-family: "微软雅黑";font-size: 13px;color: #333;position: relative;}h3{font-size: 16px;color: #545861;font-weight: 500;}header{height: 250px;background-color: #FFFFEE;background-repeat: no-repeat;background-position: 50px;}.header-left{height: 50px;}.header-right{width: 250px;height: 50px;line-height: 50px;float: right;}.header-right img{width: 25px;height: 21px;}.header-right a:active,.header-right a:visited{text-decoration: none;color: #111111;}.header-right a:active,.header-right a:hover{color: blue;}.header-text{font-size: 40px;color: #4FAC00;margin-top: 10px;margin-left: 150px;}/*=========导航样式定义===========*/nav{margin-bottom:5px;height: 36px;background-image: linear-gradient(0deg,#9cf,#fff 60%,#9cf 100%);border-bottom: 1px solid #DBEAEE;}nav ul{list-style-type: none;}nav a{display: block;width: 90px;height: 36px;float: left;padding: 0px 8px 0px 8px;margin: 0 10px 0 20px;text-decoration: none;text-align: center;font-family: tahoma;font-size: 14px;font-weight: bold;}nav ul:nth-child(1)a{width: 50px;}nav ul li a:link,nav ul li a:visited{color: #333;}nav ul li a:active,nav ul li a:hover{color: #FFF;background-image: linear-gradient(0deg,#36c,#9CF 60%,#fff 100%);}/*=========网页中部内容样式===========*/#content{width: 1050px;height: auto;}/*=========热销产品列表样式===========*/footer {clear: both;height: 100px;background: #545861;border-bottom: 1px solid #fff;color: #ffffff;text-align: center;}footer :link {padding-top: 25px;}footer :link a {display: inline-block;width: 70px;height: 36px;color: #ffffff;padding: 0px 8px 0px 8px;margin: 0 14px 0 14px;text-decoration: none;text-align: center;}footer :link a:hover {color: #ccc;text-decoration: underline;}.online_zx {position: fixed;top: 30px;right: 10px;}/*=========左侧样式===========*/#content {width: 1050px;height: auto;}#content-left {width: 250px;height: auto;float: left;}#content-left ul {list-style: none;width: 250px;background: #fff;border-radius: 10px;margin: 0 auto;}#content-left ul li {width: 250px;height: 50px;margin-bottom: 1px;padding-left: 80px;background: #DDDDDD;font-size: 14px;line-height: 55px;text-align: left;}#content ul li a:link,#content-left ul li a:visited{color: #333;}#content-left ul li a:hover{color: #0091D8;}#content-left ul .tp {font-size: 18px;font-weight: 500;padding: 0px;text-align: center;width: 250px;height: 65px;line-height: 80px;background: #BBB;border-radius: 10px 0 0;}#content-left ul .yj {height: 20px;border-radius: 0 0 0 10px;margin-bottom: 5px;}#content-right {float: right;width: 800px;height: auto;}#content-right .tt {height: 40px;width: 785px;margin-left: 15px;border-bottom: 2px solid #D6D6D6;}#content-right h3 {font-weight: 500;font-size: 16px;border-bottom: 2px solid #0091D8;width: 90px;border-bottom: 10px 0 7px 5px;}#content-right #article {width: 800px;height: auto;}</style></head><body><header><!--===============占位符图片===================--><img class="header-left" src="https://via.placeholder.com/150" alt="Placeholder Image"><div class="header-right"><a href="#"><img src="https://via.placeholder.com/150" alt="" srcset="" />官方微信</a> <span style="color: #930;">|</span><a href="login.html">管理员登录</a> <span style="color: #930;">|</span><a href="register.html">会员注册</a> <span style="color: #930;">|</span></div><div class="header-text">照明材料</div></header><!--===================横向导航栏======================--><nav><ul><li><a href="index.html">首页</a></li><li><a href="about_us.html">关于我们</a></li><li><a href="products.html">产品中心</a></li><li><a href="works.html">工程案例</a></li><li><a href="news.html">新闻动态</a></li><li><a href="about.html">招商加盟</a></li><li><a href="contact.html">联系我们</a></li></ul></nav><!--==================内容区域=====================--><div id="content"><aside id="content-left"><ul><li class="tp">关于我们</li><li><a href="companyfile.html">公司简介</a> <img src="https://via.placeholder.com/150" alt="" /></li><li><a href="">公司荣誉</a></li><li><a href="history.html">发展历程</a></li><li><a href="team.html">企业团队</a></li><li><a href="cuture.html">企业文化</a></li><li><a href="encormainls.html">公司环境</a></li><li class="yj"></li></ul></aside><div id="content-right"><div class="tt"><h3>公司荣誉</h3></div><article style="position: relative;left:15px;margin-top: 20px;"><div class="tp" style=""><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;position: relative;left: 10px;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;position: relative;left: 20px;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;position: relative;left: 30px;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;position: relative;top: 10px;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;position: relative;left: 10px;top: 10px;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;position: relative;left: 20px;top: 10px;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;position: relative;left: 30px;top: 10px;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;top: 15px;position: relative;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;position: relative;left: 10px;top: 15px;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;position: relative;left: 20px;top: 15px;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;position: relative;left: 30px;top: 15px;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;top: 20px;position: relative;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;position: relative;left: 10px;top: 20px;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;position: relative;left: 20px;top: 20px;"/><img src="https://via.placeholder.com/150" alt="" style="width: 180px;height: 200px;position: relative;left: 30px;top: 20px;"/></div></article></div><!--===============页尾====================--><footer style="position: relative;top: 30px;"><p class="link"><a href="index.html">网页首页</a>|<a href="products.html">产品中心</a>|<a href="contact.html">联系方式</a>|<a href="news.html">新闻动态</a></p><p>地址：山东省日照市学院路 爱德照明科技有限公司</p></footer><div class="online_zx"><a href="#"><img src="https://via.placeholder.com/150" alt="" /></a></div></body><script></script>
</html>相关文章：
这是一个简单的照明材料网站，后续还会更新
1、首页效果图 代码 <!DOCTYPE html> <html><head><meta charset"utf-8" /><title>爱德照明网站首页</title><style>/*外部样式*/charset "utf-8";*{margin: 0;padding: 0;box-sizing: border-box;}a{text-dec…...
【设计模式】之模板方法模式
系列文章目录 【设计模式】之策略模式 【设计模式】之责任链模式 文章目录 系列文章目录 前言 一、什么是模板方法模式 定义 角色 二、为什么要使用模板方法模式 优点 缺点 三、案例 普通案例 模拟Servlet过程案例 总结 前言 今天给大家介绍23种设计模式中的模板方法模式&a…...
【系统架构师】-选择题（十一）
1、紧耦合多机系统一般通过（共享内存）实现多机间的通信。对称多处理器结构（SMP）属于（ 紧耦合）系统。 松耦合多机系统又称间接耦合系统,—般是通过通道或通信线路实现计算机间的互连。 2、采用微内核的OS结构…...
前端开发攻略---介绍HTML中的＜dialog＞标签，浏览器的原生弹框。
1、演示 2、介绍 <dialog> 标签用于定义对话框，即一个独立的窗口，通常用来显示对话框、提示框、确认框等弹出式内容。在对话框中，可以包含文本、表单元素、按钮等内容，用户可以和这些内容进行交互。 3、兼容性 4、示例代码 …...
让外贸业绩翻倍的销售话术分享
业绩翻三倍的话术，今后无论你遇到挑剔、犹豫、理智的顾客，都能轻松搞定。点赞存起来慢慢看，以免找不到。 与客户有效沟通技巧5的20句金句 业绩翻 3 倍，今后无论你遇到挑剔、犹豫、理智的顾客，都能轻松搞定。点赞存起来…...
观测与预测差值自动变化系统噪声Q的自适应UKF（AUKF_Q）MATLAB编写
简述 基于三维模型的UKF，设计一段时间的输入状态误差较大，此时通过对比预测的状态值与观测值的残差，在相应的情况下自适应扩大系统方差Q，构成自适应无迹卡尔曼滤波（AUKF），与传统的UKF相比&…...
虚拟数据中心
创建数据中心和连接宿主机 DRS:收集群集内所有主机和虚拟机的资源使用情况信息，并根据特定的运行状况给出建议或迁移虚拟机HA:如果一台主机出现故障，则该主机上运行的所有虚拟机都将立即在同一群集的其他主机上重新启动EVC:增强型vMotionVirtual SAN:集中…...
解决Blender导出FBX文件到Unity坐标轴错误的问题
发现Blender的模型导入到Unity里面有问题,简单研究了下发现是坐标系不同,Unity使用的是左手坐标系,Blender使用的是右手坐标系 。 下面直接将如何解决 首先忽略Blender的右手坐标系以及Z轴朝上的事，依照unity坐标系情况修改模型物体的旋转，以Blender猴…...
基于微信小程序的校园二手闲置物品交易平台的设计与实现
基于微信小程序的校园二手闲置物品交易平台的设计与实现 “Design and Implementation of a Campus Second-Hand Marketplace Platform based on WeChat Mini Program” 完整下载链接:基于微信小程序的校园二手闲置物品交易平台的设计与实现 文章目录 基于微信小程序的校园二…...
java中多线程的3种实现方法
1.继承Thread类 优点：代码简单，可以直接使用Thread类里面的方法。 缺点：扩张性较差，应为在java中，一个类只能继承一个父类。 2.实现Runnable接口 3.实现Callable接口 2和3的优缺点是一样的 优点：扩展性强&…...
【Docker】docker compose服务编排
docker compose 简介 Dockerfile模板文件可以定义一个单独的应用容器，如果需要定义多个容器就需要服务编排。 docker swarm（管理跨节点） Dockerfile可以让用户管理一个单独的应用容器；而Compose则允许用户在一个模板（…...
elementui的el-select+el-tree+el-input实现可搜索的下拉树组件
部分实现代码如下 <template> <div><el-selectv-model"item.TableName"placeholder"请选择":disabled"!item.disabled"visible-change"handleVisible"ref"TableName"><el-input placeholder"请输…...
微信公众号排名 SEO的5个策略
随着微信公众号在社交媒体领域的持续发展和普及，如何提升公众号的搜索排名，成为许多运营者关注的焦点。公众号排名SEO，即针对微信公众号进行搜索引擎优化，旨在提高公众号在搜索结果中的曝光率和点击率。下面，我们将深入…...
python烟花代码
在Python中，可以使用多种方式来模拟烟花效果，其中一种常见的方法是使用turtle图形库来绘制。以下是一个简单的示例，展示了如何使用turtle来创建一个烟花效果的动画： import turtle import random# 设置屏幕和背景 screen turtle…...
Python高级编程
描述 集合，列表生成式，生成器，迭代器，切片 Python 中的集合类型是一种无序、不重复的数据容器，用于存储可哈希（hashable）的元素。Python 提供了两种内置的集合类型：set 和 frozens…...
leetCode75. 颜色分类
leetCode75. 颜色分类 题目思路 代码 class Solution { public:void sortColors(vector<int>& nums) {for(int i 0, j 0, k nums.size() - 1; i < k;){if(nums[i] 0) swap(nums[i],nums[j]);else if(nums[i] 2) swap(nums[i],nums[k--]);else if(nums[i] …...
选择器、pxcook软件、盒子模型
结构伪类选择器 定义：根据结构的元素关系来查找元素。 <title>Document</title><style>li:first-child{color:aqua ;}li:last-child{color: aqua;}li:nth-child(3){color: aqua;}</style> </head> <body><ul><li>…...
商城系统秒杀功能设计思想
业务特点 1、瞬时并发量大，秒杀时会有大量用户在同一时间进行抢购，瞬时并发访问量突增几倍、甚至几十倍以上 2、库存量少，一般秒杀活动商品量很少，这就导致了只有极少量用户能成功购买到。 3、业务和流程较为常见，一般…...
#初始化列表
1.再谈构造函数 1.1构造函数的组成 构造函数包括函数体赋值与初始化列表初始化。 1.2函数体赋值 class Date { public:Date(int year, int month, int day){_year year;_month month;_day day;} private:int _year;int _month;int _day; };虽然上述构造函数调用之后&…...
Vue-组件中的data
一个组件的data选项必须是一个函数。保证每个组件实例，维护独立的一份数据对象。如下图： 组件一旦封装好了，可以使用多次，比如数字框组件使用了三次： 每次创建新的组件实例，都会重新执行一次data函数&#…...
抖音小店达人佣金应该怎么结算呢？给达人设置多少佣金合适？
大家好，我是电商小V 咱们在运营抖音小店的时候一定会遇到被达人催促结算佣金的情况，咱们给达人合作的时候都会遇到过新手达人，就是给咱们直播带货之后催促咱们赶紧结算商品的佣金， 但是咱们都需要知道一点，那就是小店的…...
水稻病害检测（YOLO数据集，多分类，稻瘟病、纹枯病、褐斑病、枯心病、霜霉病、水稻细菌性条纹斑病、稻苞虫）
是自己利用LabelImg工具进行手工标注，数据集制作不易，请尊重版权（稻瘟病、纹枯病、褐斑病、枯心病、霜霉病、水稻细菌性条纹斑病、稻苞虫） 如果需要yolv8检测模型和数据集放在一起的压缩包，可以关注：最新最…...
MYSQL数据库专业术语及创建数据表详细讲解{sql语句创建数据库语句及条件子句解析，编码格式解析，创建数据表解析，表定义字段解析，主键约束解析}
MYSQL数据库中的专业术语 数据库（Database）：存储数据的集合，是数据的逻辑容器。 表（Table）：数据库中存储数据的结构，由行（记录）和列（字段&#x…...
Kubernetes的13个常用命令，你都熟悉吗
Kubernetes（K8s）是一个容器编排和管理工具，用于部署、管理和扩展容器化应用程序。下面是一些常用的 Kubernetes 命令及其含义： kubectl create: 创建一个资源对象，如 Pod、Deployment、Service 等。kubectl apply: 应…...
python从0开始学习（三）
目录 前言 1、类型转换 1.1 隐式类型转换 1.2 显式类型转换 2、eval函数 总结 前言 上篇我们讲了python中的变量与常量，以及变量类型。本篇文章将接着往下讲。 1、类型转换 python中的数据类型转换包括两种：隐式类型转换和显式类型转换。 1.1 隐式…...
golang判断通道chan是否关闭的2种方式
chan通道在go语言的办法编程中使用频繁，我们可以通过以下2种方式来判断channel通道是否已经关闭，1是使用 for range循环，另外是通过 for循环中if 简短语句的 逗号 ok 模式来判断。 示例代码如下： //方式1 通过for range形式判断…...
npm install 会报错npm audit错误，会提示你有多少个漏洞需要结局等
npm install 会报错 npm audit… 错误，会提示你有多少个漏洞需要结局，对应的包版本不应该低于多少等等问题 当使用npm i 命令的时候会出现以下问题 如果是个新手的话，建议直接关闭npm的audit检查。这样可以保证npm的audit不会影响你的初始…...
揭秘磁盘参数错误：数据恢复的黄金法则与预防策略
磁盘参数错误，这是一个让人头疼的电脑问题，可能会导致重要数据的丢失。不过别担心，本文将为你详细解析磁盘参数错误的来龙去脉，以及提供有效的数据恢复方法和预防措施。 一、什么是磁盘参数错误 磁盘参数错误通常指的是在读取或写…...
oracle常见操作
修改字段长度 ALTER TABLE my_table MODIFY my_column VARCHAR2(new_length);修改字段名称 ALTER TABLE my_table RENAME COLUMN old_column TO new_column;修改字段非空属性 -- 由非空改成允许为空 ALTER TABLE my_table MODIFY my_column NULL; -- 由允许为空改成非空 ALT…...
SkyWalking 自定义Span并接入告警
图容易被CSDN吞掉，我在掘金也发了：https://juejin.cn/post/7361821913398837248 我就是这么膨胀 最近在做 OpenAI API 套壳，当我使用 okhttp-sse 这个库进行流式内容转发的时候，我发现有些回调方法 SkyWalking 不能抓取到。这就…...
检察机关门户网站建设自查报告/成都seo培
转载请注明出处： http://www.cnblogs.com/darkknightzh/p/5946041.html 参考网址： http://caffe.berkeleyvision.org/tutorial/interfaces.html http://www.cnblogs.com/denny402/p/5076285.html 1. 如果直接训练时，test.sh中内容如下&#x…...
有什么网站可以做问卷调查/推广关键词外包
2019独角兽企业重金招聘Python工程师标准>>> 一、准备工作： 第一步：下载erlang http://www.erlang.org/downloads/19.3 第二步：下载rabbitMQ http://www.rabbitmq.com/download.html rabbitMQ安装完成后，打开rabbit…...
设计公司给公司做网站用了方正字体/广告联盟接广告
Objective-C中的数据类型 导航:基本数据类型对象类型id类型1.基本数据类型Objective-C中的基本类型与C语言的基本类型一样,主要有:int,long,float,double,char,void,bool等.值得注意的是,在Foundation框架中,系统为某些数据起了别名,如: NSInteger 是 long ,CGFloat是double,以…...
无极电影网手机在线观看/深圳网站设计专家乐云seo
数据库-事务隔离 文章目录数据库-事务隔离数据库 事务数据库 ACID四大特性数据库 脏读、幻读、不可重复读、事务丢失数据库 隔离级别数据库 事务 事务的概念：事务就是一个对数据库操作的序列，是一个不可分割的工作单位，要不这个序列里面的操…...
wordpress添加 google anlytics/微网站建站平台
都是在项目中总结的，经过实践的，在flex2 as3下使用的。as调jsExternalInterface.call("js函数名",参数：数组);（可以接收返回值）js调asas：ExternalInterface.addCallback("js中使用的函数名&…...
可以建设一个网站/哈尔滨seo推广
url中#(hash)的含义 hash 属性是一个可读可写的字符串，该字符串是 URL 的锚部分（从 # 号开始的部分） 1.“#”代表网页中的一个位置。其右面的字符，就是该位置的标识符 比如： http://www.example.com/index.html#print …...