非响应式深蓝灰大气网站模板.zip资源-CSDN文库

共77个文件

gif：35个

jpg：21个

js：7个

版权申诉

154 浏览量 2021-09-24 18:43:47 上传评论收藏 502KB ZIP 举报

非响应式深蓝灰大气网站模板是一个专为创建专业、优雅且具有浓厚商务气息的网站设计的资源。这个模板不包含响应式设计，意味着它可能不适合在不同尺寸的设备上自动调整布局，主要针对桌面电脑的用户体验进行优化。以下是模板中的关键组成部分及其详细解释： 1. **index.html**: 这是网站的主页文件，通常包含网站的主要导航、介绍性内容、特色展示以及一些交互元素。深蓝灰的主题色会赋予页面一种专业和稳重的感觉。 2. **News.html**: 这个页面用于展示新闻、博客文章或者公司动态。用户可以在此处添加、编辑和展示各种信息，帮助访客了解最新的活动或更新。 3. **Services.html**: 服务页面用于详细列出公司提供的各项服务。深蓝灰的色调配合清晰的布局，能够突出服务的专业性和可靠性。 4. **Products.html**: 这是产品展示页面，用于呈现公司的产品信息，包括产品特点、功能、价格等。通过精心设计的布局，可以吸引潜在客户的注意力，促使他们进一步了解产品。 5. **Contact.html**: 联系页面提供了访客与公司沟通的途径，通常包含联系表格、地址信息、电话号码和电子邮件等联系方式。深蓝灰背景下的简洁设计可以营造出专业的交流环境。 6. **css**: 这是一个样式表目录，包含所有定义网站外观和布局的CSS文件。设计师可能在这里定义了深蓝色和灰色的配色方案，以及各种元素的样式规则，如字体、间距、边距等。 7. **images**: 这个目录存储了网站使用的图像资源，包括logo、背景图片、产品图片、示例图像等。高质量的图像对于提升网站视觉效果至关重要。 8. **js**: JavaScript文件夹包含了实现网站交互功能的脚本，如滑动效果、弹出窗口、表单验证等。这些脚本让静态的HTML页面变得生动起来，提高用户体验。这个非响应式的深蓝灰大气网站模板提供了一个基础框架，帮助开发者或网页设计师快速构建一个专业的商务网站。尽管它不具备适应移动设备的能力，但在桌面端，它的设计和功能可以满足用户对专业、美观和易用性的需求。在实际使用时，用户可以根据自己的品牌和需求进行自定义修改，以创建独一无二的在线存在。

资源推荐

资源详情

资源评论

收起资源包目录

非响应式深蓝灰大气网站模板.zip （77个子文件）

css

reset.css 816B

layout.css 266B

style.css 10KB

Services.html 7KB

News.html 9KB

images

menu5_active.gif 2KB

icon3.jpg 2KB

bg_top2.jpg 47KB

box_top.jpg 4KB

menu4.gif 1KB

letter3.png 5KB

input2.gif 918B

bg_top3_repeat.jpg 1KB

line_ver1.gif 46B

text.gif 14KB

box_bot.gif 2KB

bg_bot_repeat.jpg 398B

sign_up.gif 1KB

menu2_active.gif 1KB

menu_border.gif 418B

marker_left_active.jpg 1004B

text1.jpg 63KB

bg_top_repeat.gif 346B

letter4.png 4KB

bg_top2_repeat.jpg 904B

button1_right.gif 839B

box_repeat.gif 152B

menu5.gif 1KB

menu3_active.gif 1KB

line_hor1.gif 49B

box2_top.gif 2KB

icon5.jpg 1KB

menu4_active.gif 2KB

marker_1.gif 359B

menu3.gif 1KB

menu2.gif 1KB

bg_top1_repeat.gif 180B

box2_repeat.gif 90B

bg_top3.jpg 42KB

text2.jpg 69KB

box2_bot.gif 833B

icon4.jpg 1KB

letter1.png 5KB

logo.gif 2KB

marker_left.jpg 690B

marker_right.jpg 642B

bg_bot.jpg 36KB

textarea.gif 5KB

letter5.png 4KB

letter2.png 4KB

text3.jpg 67KB

button1_left.gif 833B

icon1.jpg 2KB

menu1_active.gif 1KB

input.gif 646B

marker_2.gif 68B

button1_bg.gif 262B

bg_top1.jpg 24KB

marker_right_active.jpg 953B

button2_right.gif 840B

button2_bg.gif 297B

icon2.jpg 1KB

menu1.gif 1KB

footer_logo.gif 2KB

search.jpg 2KB

button2_left.gif 859B

PIE.htc 28KB

html5.js 1KB

jquery-1.4.2.js 70KB

cufon-yui.js 18KB

imagepreloader.js 181B

Copse_400.font.js 104KB

jquery.nivo.slider.pack.js 9KB

cufon-replace.js 273B

Products.html 7KB

Contact.html 6KB

index.html 10KB

<!DOCTYPE html> <html lang="en"> <head> <title>Home</title> <meta charset="utf-8"> <link rel="stylesheet" href="css/reset.css" type="text/css" media="all"> <link rel="stylesheet" href="css/layout.css" type="text/css" media="all"> <link rel="stylesheet" href="css/style.css" type="text/css" media="all"> <script type="text/javascript" src="js/jquery-1.4.2.js" ></script> <script type="text/javascript" src="js/cufon-yui.js"></script> <script type="text/javascript" src="js/cufon-replace.js"></script> <script type="text/javascript" src="js/Copse_400.font.js"></script> <script type="text/javascript" src="js/jquery.nivo.slider.pack.js"></script> <script type="text/javascript" src="js/imagepreloader.js"></script> <script type="text/javascript"> preloadImages([ 'images/menu1_active.gif', 'images/menu2_active.gif', 'images/menu3_active.gif', 'images/menu4_active.gif', 'images/marker_right_active.jpg', 'images/marker_left_active.jpg', 'images/menu5_active.gif']); </script>  </head> <body id="page1"> <div class="body1"> <div class="body2"> <div class="main">  <header> <div class="wrapper"> <h1><a href="index.html" id="logo">First</a></h1> <div class="right"> <nav> <ul id="top_nav"> <li><a href="#">User Area</a></li> <li><a href="#">Sitemap</a></li> </ul> <form id="search" method="post"> <div> <input type="submit" class="submit" value=""> <input type="text" class="input"> </div> </form> </nav> </div> </div> <nav id="menu"> <ul> <li class="nav1" id="active"><a href="index.html">Home</a></li> <li class="nav2"><a href="News.html">News</a></li> <li class="nav3"><a href="Services.html">Services</a></li> <li class="nav4"><a href="Products.html">Products</a></li> <li class="nav5"><a href="Contact.html">Contact</a></li> </ul> </nav> </header><div class="ic">More Website Templates @ <a href="http//shop109193845.taobao.com" >即刻工作室</a>!</div> </div> </div> </div> <div class="body3"> <div class="body4"> <div class="main"> <div class="slogan"> <div id="slider"> <img src="images/text1.jpg" alt=""> <img src="images/text2.jpg" alt=""> <img src="images/text3.jpg" alt=""> </div> </div> </div> </div> </div>   <div class="body5"> <div class="body6"> <div class="main"> <div class="wrapper"> <figure class="left"><img src="images/letter1.png" alt=""></figure> <h2>Welcome to <span>First Company</span>!</h2> First is one of <a href="http//shop109193845.taobao.com" target="_blank">free website templates</a> createdCollect from 即刻工作室. This website template is optimized for 1024 X 768 res. It is <br> also XHTML & CSS valid. This template goes with two packages – with PSD source files and without them. </div> </div> </div> </div> <div class="body7"> <div class="main"> <section id="content"> <div class="wrapper"> <article class="col1"> <div class="box1"><div class="box1_bot"><div class="box1_top"> <div class="pad"><div class="pad1"> <h2 class="center">Think.</h2> <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore.</p> <div class="wrapper center"> <a href="#" class="button"><span><span>More</span></span></a> </div> </div></div> </div></div></div> </article> <article class="col1 pad_left1"> <div class="box1"><div class="box1_bot"><div class="box1_top"> <div class="pad"> <div class="pad1"> <h2 class="center">Choose.</h2> <p>Veritatis quasi architecto beatae bitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia.</p> <div class="wrapper center"> <a href="#" class="button"><span><span>More</span></span></a> </div> </div></div> </div></div></div> </article> <article class="col1 pad_left1"> <div class="box1"><div class="box1_bot"><div class="box1_top"> <div class="pad"> <div class="pad1"> <h2 class="center">Succeed.</h2> <p>Quuntur magni dolores eos qui ratione voluptatem sequi nesciunt neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur.</p> <div class="wrapper center"> <a href="#" class="button"><span><span>More</span></span></a> </div> </div></div> </div></div></div> </article> </div> <div class="wrapper"> <article class="col2"> <div class="pad1"> <h2>Features Overview</h2> <p class="pad_bot1">This <a href="http//blog.即刻工作室/2011/02/28/free-website-template-efficient-business/" target="_blank">Free Business Website Template</a> goes with two packages – with PSD source files and without them. PSD source files are available for free for the registered members of 即刻工作室. The basic package (without PSD source is available for anyone without registration).</p> <p class="pad_bot2"> This website template has several pages: Home, News, Services, Products, Contact (note that contact us form – doesn’t work).</p> <div class="wrapper line1 marg_bot1"> <ul class="col1 list1"> <li><a href="#">Sed ut perspiciatis unde omnis</a></li> <li><a href="#">Accusantium doloremque laudantium</a></li> <li><a href="#">Aperiam eaque ipsa quae</a></li> <li><a href="#">Beatae vitae dicta explicabo minima</a></li> <li><a href="#">Nemo enim ipsam voluptatem</a></li> </ul> <ul class="list1 pad_left1 left"> <li><a href="#">Neque porro quisquam est qui</a></li> <li><a href="#">Dolorem ipsum quia dolor sit amet</a></li> <li><a href="#">Consectetur, adipisci velit</a></li> <li><a href="#">Numquam emodi tempora incidnt</a></li> <li><a href="#">Magnam aliquam quaerat</a></li> </ul> </div> <a href="#" class="button"><span><span>Read More</span></span></a> </div> </article> <article class="col1 pad_left1"> <h2>Advantages</h2> <ul class="list2"> <li><a href="#"><img src="images/icon1.jpg" alt="">Starting up</a></li> <li><a href="#"><img src="images/icon2.jpg" alt="">Finance and grants</a></li> <li><a href="#"><img src="images/icon3.jpg" alt="">Taxes, returns & payroll</a></li> <li><a href="#"><img src="images/icon4.jpg" alt="">Employment & skills</a></li> <li class="bg_none"><a href="#"><img src="images/icon5.jpg" alt="">Health, safety, premises</a></li> </ul> <div class="box1"><div class="box1_bot"><div class="box1_top"> <div class="pad"> <h2>Newsletter</h2> Sign up for weekly newsletter: <form id="sign_up" method="post"> <div> <input type="text" class="input"> <a href="#" onClick="document.getElementById('sign_up').submit()">Sign up</a> </div> </form> </div> </div></div></div> </article> </div> </section> </div> </div>   <div class="body8"> <div class="body9"> <div class="main"> <footer> <div class="col_1"> <h3>Social Networks</h3> <ul class="list3"> <li><a href="#">Twitter</a></li> <li><a href="#">Facebook</a

评论收藏

内容反馈

版权申诉