班级网站-前端网页技术精美完整源码HTML+CSS+JS
2024-04-14 15:11:20
微信公众号：创享日记
发送：班级网站
获取完整源码（打开即可用）
效果图①首页主页
效果图②关于页面
效果图③联系方式及留言
效果图④我们的画廊展示
其余及源码详见微信公众号下载！
<!DOCTYPE html>
<html lang="en">
<head>
<title>About</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/jquery.nivo.slider.pack.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/CabinSketch_700.font.js"></script>
<script type="text/javascript" src="js/EB_Garamond_400.font.js"></script>
<!-- [if lt IE 9]>
<script type="text/javascript" src="js/html5.js"></script>
<style type="text/css">
.bg {behavior:url(js/PIE.htc)}
</style>
<![endif]-->
<!-- [if lt IE 7]>
<div style='clear:both;text-align:center;position:relative'><a href="http://www.microsoft.com/windows/internet-explorer/default.aspx?ocid=ie6_countdown_bannercode"><img src="http://www.theie6countdown.com/images/upgrade.jpg" border="0" alt="" /></a>
</div>
<![endif]-->
</head>
<body id="page1">
<div class="main">
<!-- header --><header><div class="wrapper"><nav><ul id="menu"><li id="menu_active"><a href="index.html"><span>A</span>bout</a></li><li><a href="Services.html"><span>S</span>ervices</a></li><li><a href="Gallery.html"><span>G</span>allery</a></li><li><a href="Privacy.html"><span>P</span>rivacy</a></li><li><a href="Contacts.html"><span>C</span>ontacts</a></li></ul></nav></div><h1><a href="index.html" id="logo">DesignStudio.com</a></h1></header><div class="ic">More Website Templates at TemplateMonster.com!</div>
<!-- / header -->
<!-- content --><section id="content"><div class="wrapper"><article class="col1"><h2>About Us</h2><div class="pad_left1 pad_bot1"><div id="slider"><div id="for_img"><div id="nivo_slider"><img src="data:images/img1.jpg" alt=""><img src="data:images/img2.jpg" alt=""><img src="data:images/img3.jpg" alt=""><img src="data:images/img4.jpg" alt=""><img src="data:images/img5.jpg" alt=""></div></div></div><div class="pad"><p><strong>Design Studio</strong> Template is one of <a href="http://blog.templatemonster.com/free-website-templates/" target="_blank">free website templates</a> created by TemplateMonster.com team. This website template is optimized for 1024X768 screen resolution. It is also XHTML & CSS valid.</p><p>This <a href="http://blog.templatemonster.com/2011/04/04/free-website-template-web-design-studio/" target="_blank">Free Design Studio 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 Templates.com. The basic package (without PSD source is available for anyone without registration).</p></div></div><h2><span>Our Solutions</span></h2><div class="pad_left1"><div class="pad_left1"><div class="wrapper pad_top1"><div class="col3"><div class="wrapper"><figure class="left marg_right1"><img src="data:images/page1_img3.png" alt=""></figure><p class="cols"><strong class="font1">Development</strong><br>Error sit voluptatem accus antium doloremque laiantium totam rem aperiam, eaque tecto beatae.</p></div></div><div class="col3 pad_left2"><div class="wrapper"><figure class="left marg_right1"><img src="data:images/page1_img5.png" alt=""></figure><p class="cols"><strong class="font1">Creative Design</strong><br>Eorporis suscipit laboriosam, nisi ut aliquid ex ea commodi eum iure reprehenderit qui in ea voluptate.</p></div></div></div><div class="wrapper"><div class="col3"><div class="wrapper"><figure class="left marg_right1"><img src="data:images/page1_img4.png" alt=""></figure><div class="cols"><strong class="font1">Planning</strong><br>Eius modi tempora incidunt aliquam quaerat enim ad minima veniam, quis nostrum exercitationem ullam.</div></div></div><div class="col3 pad_left2"><div class="wrapper"><figure class="left marg_right1"><img src="data:images/page1_img6.png" alt=""></figure><div class="cols"><strong class="font1">Effective Strategies</strong><br>Velit esse quam nihil molestiae consequatur, vel illumqui dolorem eum fugiat voluptas laiantium totam rem.</div></div></div></div></div></div></article><article class="col2"><h3>Latest Works</h3><ul class="ul_works"><li><a href="#"><img src="data:images/page1_img1.png" alt=""></a></li><li><a href="#"><img src="data:images/page1_img2.png" alt=""></a></li></ul><h4>Recent Tweets</h4><div class="tweets"><p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem.<br><a href="#">20 days ago</a></p><p>Accusantium doloremque laudatium, totam rem aperiam, eaque ipsa.<br><a href="#">36 days ago</a></p><p>Nemo enim ipsam voluptatem quia voluptas.<br><a href="#">54 days ago</a></p></div></article></div></section>
<!-- / content -->
<!-- footer --><footer><div class="wrapper"><article class="col"><h5>Why Us</h5><ul class="list1"><li><a href="#">Sedut perspiciatis</a></li><li><a href="#">Unde omnis iste</a></li><li><a href="#">Natus error sit </a></li><li><a href="#">Volupttem accus</a></li><li><a href="#">Ntium doloremque </a></li></ul></article><article class="col pad_left2"><h5>Links</h5><ul class="list1"><li><a href="#">Audantium, totam</a></li><li><a href="#">Remaperiam, eaque</a></li><li><a href="#">Ipsa quae abillo</a></li><li><a href="#">Inventore veritatis et </a></li><li><a href="#">Quasi architecto </a></li></ul></article><article class="col pad_left2"><h5>Follow Us</h5><ul class="icons"><li><a href="#"><img src="data:images/icon1.jpg" alt="">Facebook</a></li><li><a href="#"><img src="data:images/icon2.jpg" alt="">Stumleupon</a></li><li><a href="#"><img src="data:images/icon3.jpg" alt="">Twitter</a></li><li><a href="#"><img src="data:images/icon4.jpg" alt="">Digg</a></li><li><a href="#"><img src="data:images/icon5.jpg" alt="">RSS Feed</a></li></ul></article><article id="newsletter"><h5>Newsletter</h5><form id="newsletter_form"><div class="wrapper"><input class="input" type="text" value="Enter your email here" onblur="if(this.value=='') this.value='Enter your email here'" onFocus="if(this.value =='Enter your email here' ) this.value=''" ></div><a href="#" onClick="document.getElementById('newsletter_form').submit()">Subscribe</a></form></article></div><article class="privacy"><a rel="nofollow" href="http://www.templatemonster.com/">Website template</a> designed by TemplateMonster.com<br><a href="http://www.templates.com/product/3d-models/">3D Models</a> provided by Templates.com</article><a href="index.html" class="footer_logo">Design<span>Studio</span>.com</a></footer>
<!-- / footer -->
</div>
<script type="text/javascript">Cufon.now();</script>
<script type="text/javascript">$(window).load(function() {$('#nivo_slider').nivoSlider({effect:'fold', //Specify sets like: 'fold,fade,sliceDown, sliceDownLeft, sliceUp, sliceUpLeft, sliceUpDown, sliceUpDownLeft'slices:7,animSpeed:500,pauseTime:6000,startSlide:0, //Set starting Slide (0 index)directionNav:true, //Next & PrevdirectionNavHide:false, //Only show on hovercontrolNav:true, //1,2,3...controlNavThumbs:false, //Use thumbnails for Control NavcontrolNavThumbsFromRel:false, //Use image rel for thumbscontrolNavThumbsSearch: '.jpg', //Replace this with...controlNavThumbsReplace: '_thumb.jpg', //...this in thumb Image srckeyboardNav:true, //Use left & right arrowspauseOnHover:true, //Stop animation while hoveringmanualAdvance:false, //Force manual transitionscaptionOpacity:1, //Universal caption opacitybeforeChange:function(){},afterChange:function(){},slideshowEnd:function(){} //Triggers after all slides have been shown});
});
</script>
</body>
</html>
班级网站-前端网页技术精美完整源码HTML+CSS+JS相关推荐
- 动漫网站-前端网页技术精美网站源码HTML+CSS+JS
微信公众号:创享日记 发送:动漫网站 获取完整源码(打开即可用) 效果图①主页首页 效果图②作品列表展示页 效果图③作品详情展示页 效果图④联系我们 效果图⑤博客列表 效果图⑥博客详情 效果图⑦其它 ...
- HTML网页设计结课作业~仿蘑菇街商城网站源码(HTML+CSS+JS)
HTML网页设计结课作业~仿蘑菇街商城网站源码(HTML+CSS+JS) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网页要求的总数量太多?没有合适 ...
- HTML5期末大作业：网站——美丽家乡(南京介绍7个页面) 家乡文化介绍 学生DW网页设计作业源码(HTML+CSS+JS) ~学生dreamweaver网页设计作业成品
HTML期末大作业~ 学生HTML个人网页作业作品下载 ~ web课程设计网页规划与设计 ~大学生个人网站作业模板 ~简单个人网页制作 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到 ...
- HTML期末大作业~ 明星林依晨（7页）带留言 学生网页设计作业源码(HTML+CSS+JS)
HTML期末大作业~ 明星林依晨(7页)带留言 学生网页设计作业源码(HTML+CSS+JS) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网页要求 ...
- HTML网页设计结课大作业~仿凡客服装商城主页纯HTML模板源码(HTML+CSS+JS)
HTML网页设计结课作业~服装商城主页纯HTML模板源码(HTML+CSS+JS) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网页要求的总数量太多 ...
- web课程设计网页规划与设计~时尚服装购物商城模板html源码(HTML+CSS+JS)
HTML网页设计结课作业~橙色时尚服装购物商城模板html源码 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网页要求的总数量太多?没有合适的模板?等 ...
- HTML期末大作业~ 蓝色版爱宠之家(5个页面)带留言板宠物 学生网页设计作业源码(HTML+CSS+JS)
HTML期末大作业~ 蓝色版爱宠之家(5个页面)带留言板宠物 学生网页设计作业源码(HTML+CSS+JS) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从 ...
- HTML期末大作业~ 海贼王6页代码质量好~ 学生网页设计作业源码(HTML+CSS+JS)
HTML期末大作业~ 海贼王6页代码质量好~ 学生网页设计作业源码(HTML+CSS+JS) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网页要求的 ...
- HTML期末大作业~ 大话西游之大圣娶亲电影4页面 ~学生网页设计作业源码(HTML+CSS+JS)
HTML期末大作业~ 大话西游之大圣娶亲电影4页面 ~学生网页设计作业源码(HTML+CSS+JS) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网 ...
- HTML期末大作业~ 大话西游之大圣娶亲电影4页面 ~学生网页设计作业源码(HTML+CSS+JS)...
HTML期末大作业~ 大话西游之大圣娶亲电影4页面 ~学生网页设计作业源码(HTML+CSS+JS) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网 ...
最新文章
- python+html语音人物交互_使用Python读取HTML表并与之交互
- .net core实践系列之短信服务-Api的SDK的实现与测试
- shiro学习(10)：servelet实现权限认证一
- Java8新特性（Arrays）
- windows定时自动运行R脚本的正确姿势
- matlab qpsk调制 函数,MATLAB_QPSK调制与解调
- RTSP/GB28181/SDK/EHOME协议视频智能分析共享平台EasyCVR安防视频云服务新增智能人脸识别功能
- html如何控制plc,PLC系统是如何控制数控机床的
- win10熄屏时间不对_win10的息屏时间怎么调
- 影视动画专业有木有c语言,那些头秃的专业，不了解一下？
- 你身边长期不上班的人，靠什么活着？
- 【题解】[POI2005] SZA-Template
- C1-01基础任务和知识拓展
- Tableau入门（Tableau10.5.0）
- PHP学习笔记-Session
- 微信公众号如何获得原创保护？
- 求二叉树中度为1的结点个数
- 433M无限遥控发射与接收
- Android Treble结构：Part 2 - 概述
- Wagon部署springboot项目读取配置文件错误问题