班级网站-前端网页技术精美完整源码HTML+CSS+JS

微信公众号:创享日记
发送:班级网站
获取完整源码(打开即可用)
在这里插入图片描述


效果图①首页主页

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

效果图②关于页面

在这里插入图片描述
在这里插入图片描述

效果图③联系方式及留言

在这里插入图片描述
在这里插入图片描述

效果图④我们的画廊展示

在这里插入图片描述

其余及源码详见微信公众号下载!

<!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="images/img1.jpg" alt=""><img src="images/img2.jpg" alt=""><img src="images/img3.jpg" alt=""><img src="images/img4.jpg" alt=""><img src="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 &amp; 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="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="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="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="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="images/page1_img1.png" alt=""></a></li><li><a href="#"><img src="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="images/icon1.jpg" alt="">Facebook</a></li><li><a href="#"><img src="images/icon2.jpg" alt="">Stumleupon</a></li><li><a href="#"><img src="images/icon3.jpg" alt="">Twitter</a></li><li><a href="#"><img src="images/icon4.jpg" alt="">Digg</a></li><li><a href="#"><img src="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>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/347180.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

医药协会网站-前端网页技术设计HTML+CSS精美完整网页网站源码

微信公众号&#xff1a;创享日记 发送&#xff1a;医药协会网站 获取完整源码 效果图预览①主页首页 效果图预览②资源下载中心 效果图预览③登录/注册 效果图预览④文章资讯详情 效果图预览⑤文章资讯列表 效果图预览⑥留言板 效果图预览⑦图文列表 效果图预览⑧图文详情 源码…

数字通信系统仿真的MATLAB实现(QPSK)

关注公号【逆向通信猿】更精彩!!! 仿真结果 本文以QPSK为调制体制进行仿真,以下结果为比特信噪比Eb/N0=10dB(此时符号信噪比Es/N0=13dB,SNR信噪比=3.98dB,换算关系在代码中为第44行)时的各步骤结果图

动漫网站-前端网页技术精美网站源码HTML+CSS+JS

微信公众号&#xff1a;创享日记 发送&#xff1a;动漫网站 获取完整源码&#xff08;打开即可用&#xff09; 效果图①主页首页 效果图②作品列表展示页 效果图③作品详情展示页 效果图④联系我们 效果图⑤博客列表 效果图⑥博客详情 效果图⑦其它 其它及源码详见微信公众号下…

【2021.02.09更新】数学常用基本公式

泰勒级数 条件不多说了&#xff0c;函数f(x)f(x)f(x)在点xx0x {x_0}xx0​出展开为 f(x0)f′(x0)(x−x0)f′′(x0)2!(x−x0)2⋯f(n)(x0)n!(x−x0)n⋯f({x_0}) f({x_0})(x - {x_0}) \frac{{f({x_0})}}{{2!}}{(x - {x_0})^2} \cdots \frac{{{f^{(n)}}({x_0})}}{{n!}}{(x - {…

服装商城电商-前端网页技术精美完整源码HTML+CSS+JS

微信公众号&#xff1a;创享日记 发送&#xff1a;服装电商 获取完整源码&#xff08;打开即可用&#xff09; 效果①主页首页 效果②登录页 效果③注册页 效果④结算结账页 效果⑤联系页 效果⑥找不到资源页 效果⑦商品列表页 效果⑧商品详情页 效果⑨心愿清单页 其余及源码详…

【2021.02.09更新】数字信号处理公式推导

卷积 h(t)⊗x(t)∫−∞∞h(τ)x(t−τ)dτh(t) \otimes x(t) \int_{ - \infty }^{ \infty } {h(\tau )x(t - \tau )d\tau }h(t)⊗x(t)∫−∞∞​h(τ)x(t−τ)dτ 令τut2\tau u \frac{t}{2}τu2t​&#xff0c;则 h(t)⊗x(t)∫−∞∞h(ut2)x(−ut2)duh(t) \otimes x(t) …

旅游展示网站-前端网页设计技术完整精美源码HTML+CSS+JS

微信公众号&#xff1a;创享日记 发送&#xff1a;旅游网站 获取完整源码&#xff08;打开即可用&#xff09; 效果①首页主页 效果②关于我们页 效果③提供的服务页 效果④我们的能力页 /*页面重置*/ html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote…

【2021.01.01】人生中很重要的一个十年,差强人意

回顾整个2020年&#xff0c;是疯狂的一年&#xff0c;也是令人难忘的一年&#xff0c;对于我也是比较励志的一年&#xff0c;绝对是自己人生中的一个里程碑。完成了人生中最重要的一件大事&#xff0c;感谢有你一直陪着我&#xff0c;愿天下有情人终成眷属&#xff0c;最终走到…

数字信号处理实验一 系统响应及系统稳定性

前些天发现了十分不错的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;没有广告&#xff0c;分享给大家&#xff0c;大家可以自行看看。&#xff08;点击跳转人工智能学习资料&#xff09; 微信公众号&#xff1a;创享日记 发送&#xff1a;响应及稳定…

数字信号处理实验二 IIR数字滤波器设计及软件实现

前些天发现了十分不错的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;没有广告&#xff0c;分享给大家&#xff0c;大家可以自行看看。&#xff08;点击跳转人工智能学习资料&#xff09; 微信公众号&#xff1a;创享日记 发送&#xff1a;iir滤波器 …

高级java开发_适用于高级Java开发人员的十大书籍

高级java开发Java是当今最流行的编程语言之一。 有很多适合初学者的书籍。 但是对于那些使用Java进行过一段时间编程的人来说&#xff0c;其中有些人看起来有些简单和多余。 初学者的书没有带来新鲜有趣的想法。 但是&#xff0c;高级Java书籍并不总是就在眼前&#xff0c;并非…

数字信号处理实验三 FIR数字滤波器设计与软件实现

前些天发现了十分不错的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;没有广告&#xff0c;分享给大家&#xff0c;大家可以自行看看。&#xff08;点击跳转人工智能学习资料&#xff09; 微信公众号&#xff1a;创享日记 发送&#xff1a;fir滤波器 …

无线定位技术实验一 TDOA-FDOA联合定位

前些天发现了十分不错的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;没有广告&#xff0c;分享给大家&#xff0c;大家可以自行看看。&#xff08;点击跳转人工智能学习资料&#xff09; 微信公众号&#xff1a;创享日记 发送&#xff1a;联合定位 获…

无线定位技术实验二 TDOA最小二乘定位法

前些天发现了十分不错的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;没有广告&#xff0c;分享给大家&#xff0c;大家可以自行看看。&#xff08;点击跳转人工智能学习资料&#xff09; 微信公众号&#xff1a;创享日记 发送&#xff1a;tdoa最小二…

无线定位技术实验三 基于信号强度的位置指纹定位仿真

前些天发现了十分不错的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;没有广告&#xff0c;分享给大家&#xff0c;大家可以自行看看。&#xff08;点击跳转人工智能学习资料&#xff09; 微信公众号&#xff1a;创享日记 发送&#xff1a;指纹定位 获…

信号处理系统综合设计-最小阶数的IIR数字高通滤波器

微信公众号&#xff1a;创享日记 发送&#xff1a;最小阶 获取完整报告&#xff08;含源代码程序结果分析&#xff09; 设计一个最小阶数的IIR数字高通滤波器&#xff0c;指标要求如下&#xff1a; 以小于1dB的衰减通过150Hz的分量&#xff1b;以至少40dB抑制100Hz的分量&…

java 设计模式 示例_Java中的策略设计模式-示例教程

java 设计模式 示例策略模式是行为设计模式之一 。 当我们对一个特定的任务有多种算法并且客户决定在运行时使用的实际实现时&#xff0c;将使用策略模式。 策略模式也称为策略模式 。 我们定义了多种算法&#xff0c;并让客户端应用程序将算法用作参数。 此模式的最佳示例之一…

电磁场与电磁波实验二 熟悉Matlab PDEtool在二维电磁问题的应用

微信公众号&#xff1a;创享日记 发送&#xff1a;二维电磁 获取完整报告&#xff08;含源程序代码结果分析&#xff09; 一、实验过程 1.命令行输入pdetool打开工具箱 2.使用矩形工具拖动绘制矩形。 3.点击 4.双击矩形框上边&#xff0c;设置参数如下&#xff1a; 二、实验…

Spring Boot&JPA&Hibernate&Oracle

在本教程中&#xff0c;我们将展示如何创建一个Spring Boot应用程序&#xff0c;该应用程序通过Hibernate与Oracle数据源进行通信。 先决条件&#xff1a; Eclipse IDE&#xff08;最新版本&#xff09; Maven的4 Java 1.8 1-创建Maven项目 打开eclipse&#xff0c;然后创…

电磁场与电磁波实验三 熟悉Mathematica软件在电磁场领域的应用

微信公众号&#xff1a;创享日记 发送&#xff1a;mathematica 获取完整报告 一、电磁波 该模型显示了极化正弦波的垂直电、磁分量。 在真空中&#xff0c;这种波以光速传播。 二、电磁环 假设一个铜环(或其他导电环)放在电磁铁的一极上。当电流接通时(如图中红色的电路颜色…