HTML 网页设计
css标签，网页模板/*
Author: W3layout
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
*/
/* reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,nav ul,nav li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
ol,ul{list-style:none;margin:0;padding:0;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
table{border-collapse:collapse;border-spacing:0;}
/* start editing from here */
a{text-decoration:none;}
.txt-rt{text-align:right;}/* text align right */
.txt-lt{text-align:left;}/* text align left */
.txt-center{text-align:center;}/* text align center */
.float-rt{float:right;}/* float right */
.float-lt{float:left;}/* float left */
.clear{clear:both;}/* clear float */
.pos-relative{position:relative;}/* Position Relative */
.pos-absolute{position:absolute;}/* Position Absolute */
.vertical-base{ vertical-align:baseline;}/* vertical align baseline */
.vertical-top{ vertical-align:top;}/* vertical align top */
.underline{ padding-bottom:5px; border-bottom: 1px solid #eee; margin:0 0 20px 0;}/* Add 5px bottom padding and a underline */
nav.vertical ul li{ display:block;}/* vertical menu */
nav.horizontal ul li{ display: inline-block;}/* horizontal menu */
img{max-width:100%;}
/*end reset*/
body, html {
font-size: 100%;
height: 100%;
}
body {
font-family:Arial, Helvetica, sans-serif;
background:url(../images/bg2.jpg)no-repeat;
background-color:#FFF;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
background-attachment: fixed;
background-position:100% center;
}
.wrap{
width:95%;
margin:0 auto;
}
/***** Header ****/
.header{
border-top:5px solid #111;
}
.logo{
text-align:center;
margin:10px 0;
}
.menu {
text-align:center
}
.menu li a{
font-size:0.8em;
padding:10px;
display:block;
color:#FFF;
text-transform: uppercase;
background-color:rgba(70, 70, 70, 0.47);
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
margin-bottom: 5px;
}
.menu li a:hover{
background:#222;
}
.bl-content{
background:rgba(0, 0, 0, 0.58);
}
.bl-main > section {
display:inline-block;
width:24%;
}
.bl-box {
position: relative;
width: 100%;
height: 100%;
cursor: pointer;
}
.bl-box h2 a{
font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;
color:#FFF;
text-align: center;
margin: 0;
padding:15px 0;
width: 100%;
font-size:0.8em;
display: block;
text-transform: uppercase;
background-color:rgba(70, 70, 70, 0.45);
}
.bl-box h2:hover {
background:#222;
color:#FFF;
}
/* Custom content */
.works > ul {
list-style: none;
padding: 0;
margin: 0;
}
.works > ul li {
display: inline-block;
width:48.5%;
padding:0%;
}
.works > ul li a {
display: block;
padding: 0;
border:3px solid #FFF;
}
.works > ul li a img {
display: block;
max-width: 100%;
width:100%;
}
.works p{
font-size:0.8em;
color:#FFF;
line-height:1.6em;
padding:5px 0;
}
/* Panel Items */
div.bl-panel-items,
div.bl-panel-items > div {
width: 100%;
height: 100%;
}
div.bl-panel-items > div > div {
margin: 0 auto;
opacity: 1;
padding:0 10px;
}
div.bl-panel-items > div > div h3 {
font-size:1.2em;
color:#000;
margin: 0 0 5px 0;
}
div.bl-panel-items > div > div p {
font-size:0.8em;
color:#5A5A5C;
line-height:1.6em;
}
div.bl-panel-items > div > div img {
float:none;
margin:20px 0px 5px 0;
max-width: 100%;
}
div.bl-panel-items {
top: 100%;
z-index: 9999;
}
div.bl-panel-items > div {
background:rgba(252, 252, 252, 0.760784);
}
/**** About ***/
.bl-content h2 {
font-size:1.2em;
color:#FFF;
padding: 5px 0;
margin-top:20px;
text-transform:uppercase;
}
.about_img img{
padding:2px;
background:#FFF;
border:1px solid #DBDBDB;
margin:5px 0;
width:98%;
}
.about_data p{
font-size:0.9em;
color:#FFF;
line-height:1.6em;
padding:5px 0;
}
.content_bottom_right {
margin-top:80px;
padding-bottom:20px;
}
.posts{
padding:10px 0 20px;
border-bottom: 1px dashed #EEE;
}
.date{
float:left;
width:40px;
}
.posts figure{
font-weight:bold;
font-size:10px;
color: #FFF;
text-align:center;
border-right:1px solid #EEE;
padding:0 10px 2px 0;
}
.posts figure span{
font-size:3em;
line-height: 52px;
color:#F18D05;
display:block;
margin-bottom:-10px;
letter-spacing:-1px;
}
.post_desc{
float:left;
padding-left:4%;
width:77%;
}
.post_desc p{
color:#FFF;
font-size:0.9em;
line-height:1.6em;
}
/***** Blog*****/
.image {
clear: both;
padding: 0px;
margin: 0px;
padding:10px 0;
}
.group:before,
.group:after {
content:"";
display:table;
}
.group:after {
clear:both;
}
.group {
zoom:1;
}
.grid {
display: block;
float:none;
margin: 0% 0 0% 0%;
}
.grid:first-child { margin-left: 0; }
.images_3_of_1 {
width:100%;
position:relative;
margin-bottom:10px;
}
.blog-leftgrids{
padding-top:10px;
}
.blog-desc{
width:100%;
}
.images_3_of_1 img {
max-width:100%;
display:block;
padding:2px;
background:#FFF;
border:1px solid #FFF;
width:98%;
}
.blog-desc h3{
padding-bottom:5px;
}
.blog-desc h3 a{
color:#FFF;
font-size:0.9em;
font-weight:bold;
}
.blog-desc p {
color:#FFF;
font-size:0.823em;
line-height:1.6em;
}
/*** Buttons ****/
.button {
float:right;
font-size:0.9em;
text-transform:uppercase;
margin-top: 15px;
display: inline-block;
font-weight: bold;
line-height: 18px;
padding:8px 10px;
background-color: #f18d05;
border-color: #bf7004;
color: white;
}
.button:hover {
background-color: #f18d05;
}
.button:active {
background: #d8891e;
color: #8d5303;
}
/*----artical-links---*/
.artical-links{
padding: 10px 0px;
border: 1px solid rgba(255, 255, 255, 0.19);
border-left: none;
margin-top: 5px;
border-right: none;
}
.artical-links ul li{
display:inline-block;
}
.artical-links ul li img{
vertical-align:middle;
padding-right:10px;
}
.artical-links ul li a{
font: 400 14px/22px Arial;
color:#F18D05;
padding-right: 20px;
}
.artical-links ul li a:hover{
color:#FFF;
}
/*** Page numbers ***/
.content-pagenation{
padding:35px 0;
}
.content-pagenation li {
display: inline-block;
}
.content-pagenation li a {
color:#F18D05;
font-size: 0.8em;
font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;
background:#FFF;
padding:8px 10px;
}
.content-pagenation li a:hover{
background:#F18D05;
color:#FFF;
}
/* Contact Form ============================================================================= */
.section {
clear: both;
padding: 0px;
margin: 0px;
}
.group:before,
.group:after {
content:"";
display:table;
}
.group:after {
clear:both;
}
.group {
zoom:1;
}
.col{
display: block;
float:left;
margin: 2% 0 2% 0%;
}
.col:first-child{
margin-left:0;
}
.span_2_of_3 {
width:100%;
padding:0%;
}
.span_1_of_3 {
width:100%;
padding:0%;
margin-top:10px;
}
.span_2_of_3 h3,
.span_1_of_3 h3 {
color:#FFF;
font-size:1.5em;
margin-bottom:10px;
}
.contact-form{
position:relative;
padding-top:15px;
}
.contact-form div{
padding:5px 0;
}
.contact-form span{
display:block;
font-size:0.9em;
color:#F18D05;
padding-bottom:5px;
font-family :verdana, arial, helvetica, helve, sans-serif;
}
.contact-form input[type="text"],.contact-form textarea{
padding:6px;
display:block;
width:94%;
background: rgba(252, 252, 252, 0);
border:1px solid rgba(255, 255, 255, 0.38);
outline:none;
font-size:1.2em;
font-family:Arial, Helvetica, sans-serif;
color:#FFF;
-webkit-appearance:none;
}
.contact-form textarea{
resize:none;
height:120px;
}
.myButton {
text-transform:uppercase;
display: inline-block;
font-weight: bold;
line-height:18px;
border:none;
background: #465467;
color: #fff;
font-size:1em;
padding:8px 12px;
background-color: #f18d05;
border-color: #bf7004;
cursor:pointer;
}
.myButton:hover {
background-color: #f18d05;
}
.myButton:active {
background: #d8891e;
color: #8d5303;
}
.company_address p{
color:#FFF;
font-size:0.9em;
line-height:1.8em;
}
.company_address p span{
text-decoration:underline;
color:#EEE;
cursor:pointer;
}
.contact_info{
padding-top:30px;
}
.map{
border:1px solid #CCC;
margin-bottom:10px;
}
.copy_right{
padding:25px 0 10px 0;
text-align:center;
font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;
}
.copy_right p{
font-size:0.8123em;
color: #FFF;
line-height:1.8em;
}
.copy_right p a{
color: #FFF;
font-size:1em;
text-decoration:underline;
}
.copy_right p a:hover{
color:#FD9200;
text-decoration:none;
}
文件下载
资源详情
[{"title":"（ 91 个子文件 14.54MB ） HTML 网页设计","children":[{"title":"html","children":[{"title":".idea","children":[{"title":"scopes","children":[{"title":"scope_settings.xml <span style='color:#111;'> 143B </span>","children":null,"spread":false}],"spread":true},{"title":"workspace.xml <span style='color:#111;'> 16.56KB </span>","children":null,"spread":false}],"spread":true},{"title":"mobile","children":[{"title":"css","children":[{"title":"style.css <span style='color:#111;'> 8.88KB </span>","children":null,"spread":false}],"spread":true},{"title":"images","children":[{"title":"8.jpg <span style='color:#111;'> 178.30KB </span>","children":null,"spread":false},{"title":"blog-img2.jpg <span style='color:#111;'> 11.34KB </span>","children":null,"spread":false},{"title":"blog-icon5.png <span style='color:#111;'> 486B </span>","children":null,"spread":false},{"title":"about_img.jpg <span style='color:#111;'> 279.78KB </span>","children":null,"spread":false},{"title":"6.jpg <span style='color:#111;'> 263.14KB </span>","children":null,"spread":false},{"title":"1.gif <span style='color:#111;'> 608.06KB </span>","children":null,"spread":false},{"title":"5.jpeg <span style='color:#111;'> 241.41KB </span>","children":null,"spread":false},{"title":"3.jpg <span style='color:#111;'> 130.73KB </span>","children":null,"spread":false},{"title":"blog-img.jpg <span style='color:#111;'> 70.35KB </span>","children":null,"spread":false},{"title":"7.jpeg <span style='color:#111;'> 54.69KB </span>","children":null,"spread":false},{"title":"2.jpeg <span style='color:#111;'> 29.00KB </span>","children":null,"spread":false},{"title":"blog-icon3.png <span style='color:#111;'> 421B </span>","children":null,"spread":false},{"title":"blog-icon4.png <span style='color:#111;'> 306B </span>","children":null,"spread":false},{"title":"4.jpg <span style='color:#111;'> 1.49MB </span>","children":null,"spread":false},{"title":"blog-icon2.png <span style='color:#111;'> 416B </span>","children":null,"spread":false},{"title":"blog-icon1.png <span style='color:#111;'> 529B </span>","children":null,"spread":false},{"title":"blog-img3.jpg <span style='color:#111;'> 171.60KB </span>","children":null,"spread":false},{"title":"logo.png <span style='color:#111;'> 5.56KB </span>","children":null,"spread":false},{"title":"bg2.jpg <span style='color:#111;'> 1.15MB </span>","children":null,"spread":false}],"spread":false},{"title":"fonts","children":[{"title":"CaviarDreams_Italic-webfont.ttf <span style='color:#111;'> 47.55KB </span>","children":null,"spread":false},{"title":"BonvenoCF-Light-webfont.ttf <span style='color:#111;'> 32.13KB </span>","children":null,"spread":false}],"spread":true},{"title":"works.html <span style='color:#111;'> 2.81KB </span>","children":null,"spread":false},{"title":"index.html <span style='color:#111;'> 1.02KB </span>","children":null,"spread":false},{"title":"blog.html <span style='color:#111;'> 7.03KB </span>","children":null,"spread":false},{"title":"details.html <span style='color:#111;'> 5.93KB </span>","children":null,"spread":false},{"title":"about.html <span style='color:#111;'> 4.25KB </span>","children":null,"spread":false},{"title":"contact.html <span style='color:#111;'> 3.51KB </span>","children":null,"spread":false}],"spread":true},{"title":"web","children":[{"title":"css","children":[{"title":"slider.css <span style='color:#111;'> 1.62KB </span>","children":null,"spread":false},{"title":"style.css <span style='color:#111;'> 21.25KB </span>","children":null,"spread":false}],"spread":true},{"title":"images","children":[{"title":"8.jpg <span style='color:#111;'> 178.30KB </span>","children":null,"spread":false},{"title":"blog-img2.jpg <span style='color:#111;'> 11.34KB </span>","children":null,"spread":false},{"title":"blog-icon5.png <span style='color:#111;'> 486B </span>","children":null,"spread":false},{"title":"about_img.jpg <span style='color:#111;'> 279.78KB </span>","children":null,"spread":false},{"title":"2.jpg <span style='color:#111;'> 29.00KB </span>","children":null,"spread":false},{"title":"6.jpg <span style='color:#111;'> 263.14KB </span>","children":null,"spread":false},{"title":"1.gif <span style='color:#111;'> 608.06KB </span>","children":null,"spread":false},{"title":"3.jpg <span style='color:#111;'> 130.73KB </span>","children":null,"spread":false},{"title":"blog-img.jpg <span style='color:#111;'> 70.35KB </span>","children":null,"spread":false},{"title":"bg3.jpg <span style='color:#111;'> 334.72KB </span>","children":null,"spread":false},{"title":"5.jpg <span style='color:#111;'> 241.41KB </span>","children":null,"spread":false},{"title":"bg4.jpg <span style='color:#111;'> 363.57KB </span>","children":null,"spread":false},{"title":"blog-icon3.png <span style='color:#111;'> 421B </span>","children":null,"spread":false},{"title":"blog-icon4.png <span style='color:#111;'> 306B </span>","children":null,"spread":false},{"title":"4.jpg <span style='color:#111;'> 1.49MB </span>","children":null,"spread":false},{"title":"blog-icon2.png <span style='color:#111;'> 416B </span>","children":null,"spread":false},{"title":"blog-icon1.png <span style='color:#111;'> 529B </span>","children":null,"spread":false},{"title":"blog-img3.jpg <span style='color:#111;'> 171.60KB </span>","children":null,"spread":false},{"title":"close_black.png <span style='color:#111;'> 361B </span>","children":null,"spread":false},{"title":"close-button.png <span style='color:#111;'> 1.88KB </span>","children":null,"spread":false},{"title":"logo.png <span style='color:#111;'> 6.15KB </span>","children":null,"spread":false},{"title":"7.jpg <span style='color:#111;'> 54.69KB </span>","children":null,"spread":false},{"title":"bg2.jpg <span style='color:#111;'> 1.15MB </span>","children":null,"spread":false}],"spread":false},{"title":"fonts","children":[{"title":"CaviarDreams_Italic-webfont.ttf <span style='color:#111;'> 47.55KB </span>","children":null,"spread":false},{"title":"BonvenoCF-Light-webfont.ttf <span style='color:#111;'> 32.13KB </span>","children":null,"spread":false}],"spread":true},{"title":"index.html <span style='color:#111;'> 25.50KB </span>","children":null,"spread":false},{"title":"js","children":[{"title":"jquery.min.js <span style='color:#111;'> 90.46KB </span>","children":null,"spread":false},{"title":"modernizr.custom.js <span style='color:#111;'> 8.96KB </span>","children":null,"spread":false},{"title":"boxlayout.js <span style='color:#111;'> 3.98KB </span>","children":null,"spread":false}],"spread":true}],"spread":true},{"title":"smartphone","children":[{"title":"css","children":[{"title":"style.css <span style='color:#111;'> 14.87KB </span>","children":null,"spread":false}],"spread":true},{"title":"images","children":[{"title":"8.jpg <span style='color:#111;'> 178.30KB </span>","children":null,"spread":false},{"title":"blog-img2.jpg <span style='color:#111;'> 11.34KB </span>","children":null,"spread":false},{"title":"blog-icon5.png <span style='color:#111;'> 486B </span>","children":null,"spread":false},{"title":"about_img.jpg <span style='color:#111;'> 279.78KB </span>","children":null,"spread":false},{"title":"2.jpg <span style='color:#111;'> 29.00KB </span>","children":null,"spread":false},{"title":"6.jpg <span style='color:#111;'> 263.14KB </span>","children":null,"spread":false},{"title":"1.gif <span style='color:#111;'> 608.06KB </span>","children":null,"spread":false},{"title":"3.jpg <span style='color:#111;'> 130.73KB </span>","children":null,"spread":false},{"title":"blog-img.jpg <span style='color:#111;'> 70.35KB </span>","children":null,"spread":false},{"title":"5.jpg <span style='color:#111;'> 241.41KB </span>","children":null,"spread":false},{"title":"blog-icon3.png <span style='color:#111;'> 421B </span>","children":null,"spread":false},{"title":"blog-icon4.png <span style='color:#111;'> 306B </span>","children":null,"spread":false},{"title":"4.jpg <span style='color:#111;'> 1.49MB </span>","children":null,"spread":false},{"title":"blog-icon2.png <span style='color:#111;'> 416B </span>","children":null,"spread":false},{"title":"blog-icon1.png <span style='color:#111;'> 529B </span>","children":null,"spread":false},{"title":"blog-img3.jpg <span style='color:#111;'> 171.60KB </span>","children":null,"spread":false},{"title":"close_black.png <span style='color:#111;'> 361B </span>","children":null,"spread":false},{"title":"close-button.png <span style='color:#111;'> 1.88KB </span>","children":null,"spread":false},{"title":"logo.png <span style='color:#111;'> 8.31KB </span>","children":null,"spread":false},{"title":"7.jpg <span style='color:#111;'> 54.69KB </span>","children":null,"spread":false},{"title":"bg2.jpg <span style='color:#111;'> 1.15MB </span>","children":null,"spread":false}],"spread":false},{"title":"fonts","children":[{"title":"CaviarDreams_Italic-webfont.ttf <span style='color:#111;'> 47.55KB </span>","children":null,"spread":false},{"title":"BonvenoCF-Light-webfont.ttf <span style='color:#111;'> 32.13KB </span>","children":null,"spread":false}],"spread":true},{"title":"works.html <span style='color:#111;'> 2.74KB </span>","children":null,"spread":false},{"title":"index.html <span style='color:#111;'> 1.59KB </span>","children":null,"spread":false},{"title":"blog.html <span style='color:#111;'> 7.06KB </span>","children":null,"spread":false},{"title":"details.html <span style='color:#111;'> 4.95KB </span>","children":null,"spread":false},{"title":"about.html <span style='color:#111;'> 9.34KB </span>","children":null,"spread":false},{"title":"contact.html <span style='color:#111;'> 3.96KB </span>","children":null,"spread":false}],"spread":true}],"spread":true}],"spread":true}]
评论信息
其他资源
- VISIO最全无敌电子元件器件库
- 一元三次方程求解的C++实现
- 中文情感词典
- smartctl源码
- Cygwin中make3.8.1的修正版
- hownet完整版中导出的上下位关系txt版本
- 同济版高数第七版
- 通过串口和51单片机控制舵机转动（有4种转动方式）
- 虚拟串口vuart驱动
- VBA编程教程
- 328个透明背景FLASH特效效果展示（swf文件）
- 代理猎狗，在线使用代理
- OPCDA服务器与客户程序开发指南 第一部分（共两部分）
- 简单编译器 编译技术课程设计源代码及文档
- matlab制作梳状滤波器
- 吉林省第九届题大学生数学建模竞赛B
- Blender 基础教程 (中文语音)
- MSP430F149+1602数码显示和实时时钟
- Hangfire.Pro.Redis.2.2.2
免责申明
【只为小站】的资源来自网友分享，仅供学习研究，请务必在下载后24小时内给予删除，不得用于其他任何用途，否则后果自负。基于互联网的特殊性，【只为小站】 无法对用户传输的作品、信息、内容的权属或合法性、合规性、真实性、科学性、完整权、有效性等进行实质审查；无论 【只为小站】 经营者是否已进行审查，用户均应自行承担因其传输的作品、信息、内容而可能或已经产生的侵权或权属纠纷等法律责任。
本站所有资源不代表本站的观点或立场，基于网友分享，根据中国法律《信息网络传播权保护条例》第二十二条之规定，若资源存在侵权或相关问题请联系本站客服人员，zhiweidada#qq.com，请把#换成@，本站将给予最大的支持与配合，做到及时反馈和处理。关于更多版权及免责申明参见 版权及免责申明
本站所有资源不代表本站的观点或立场，基于网友分享，根据中国法律《信息网络传播权保护条例》第二十二条之规定，若资源存在侵权或相关问题请联系本站客服人员，zhiweidada#qq.com，请把#换成@，本站将给予最大的支持与配合，做到及时反馈和处理。关于更多版权及免责申明参见 版权及免责申明