CSS背景图片设置
*{
margin:0px;
padding:0px;
list-style: none;
text-decoration: none;
font-family: Arial,'Microsoft YaHei',"Helvetica Neue",Helvetica,sans-serif;
}
body{
background-color: #e5e5e5;
background: url(../images/tyczz2.jpg);
background-position: center top;
background-size: 100%;
background-repeat: no-repeat;
background-attachment: fixed;
}
.main{
background-color: #ffffff;
width:1220px;
margin:0 auto;
height:1480px;
}
.head{
width:100%;
height:40px;
background-color:#000;
}
.nav{
position:relative;
z-index:;
}
.nav ul{
width:1305px;
height:40px;
margin:0px auto;
}
.nav ul li{
font-size:16px;
color:#fff;
width:115px;
height:40px;
float:left;
text-align:center;
margin-left:30px;
}
.nav ul li dl a{
color:#fff;
}
.nav ul li dl dt{
margin:0px;
padding:0px;
width:115px;
height:40px;
line-height:40px;
position: relative;
}
.nav ul li dl dt:hover{
background-color:#173E7B;
}
.nav ul li dl dd{
font-size:14px;
color:black;
width:115px;
height:30px;
background-color:#000;
border-top:1px solid #fff;
line-height: 30px;
display:none;
border-radius:5px;
}
.nav ul li:hover dl dd{
display:block;
position:relative;
}
.nav ul li dl dd .hot{
color:red;
}
.nav ul li dl dd a:hover{
color: #ffd053;
}
.nav ul li dl dd .hot:hover{
color:#44EAAD;
}
.nav ul li dl dt img{
position:absolute;
bottom:25px;
}
.nav ul li dl dd .hot-img {
position:absolute;
bottom:20px;
}
.creat{
display: inline-block;
width:;
height:;
margin-left: 2px;
vertical-align: middle;
border-top: 4px dashed;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
}
.nav ul li dl dd p{
width:60px;
height:30px;
line-height:30px;
}
.ad1{
width:100%;
margin:0px auto;
margin-left:10px;
}
.ad{
width:100%;
height:110px;
margin:5px auto;
margin-left:10px;
}
/***********************************************************************/
.container{
width:1200px;
height:568px;
margin-left:10px;
}
.promo{
width:800px;
height:458px;
float:left;
}
.rec{
width:350px;
height:458px;
float:left;
}
.pic{
width:115px;
height: 70px;
float:left;
margin-right:15px;
}
.promo ul li{
width:100%;
height:70px;
margin-top:15px;
}
.promo ul li p{
position: relative;
}
.promo ul li p a{
color:#f60;
position:absolute;
right:0px;
top:0px;
}
.promo ul li p a:hover{
text-decoration: underline;
}
.promo ul li h3 a{
display:block;
color: #333;
font-size: 18px;
margin-bottom:8px;
}
.promo ul li h3 a:hover{
text-decoration: underline;
color: #FF6600;
}
.promo ul li p {
font-size: 12px;
height: 40px;
line-height: 20px;
overflow: hidden;
color: #666565;
position: relative;
}
.rec{
margin-left: 50px;
}
/***********************************************************************/
.rec-type{
width: 350px;
height: 165px;
}
.rec-1{
width:350px;
height:45px;
border-left:3px solid #00aa98;
padding-left:7px;
margin-top:15px;
}
.rec-1 h3{
font-size: 16px;
height:27px
line-height:22px;
color:#000;
padding: 0 12px 0 5px;
float:left;
}
.rec-1 span{
display:block;
color:#787878;
height:27px;
line-height:24px;
font-size: 12px;
}
.rec-4{
padding:0 8px;
font-size: 14px;
height:18px;
line-height:20px;
}
.rec a{
color:#333;
}
.rec a:hover{
text-decoration: underline;
}
.promo h2{
border-bottom: 3px solid #00aa98;
display:inline-block;
height: 30px;
padding-left: 28px;
background: url(../images/ico_i_sys.png) 0 0 no-repeat;
}
.rec h2{
border-bottom: 3px solid #00aa98;
display:inline-block;
height: 30px;
padding-left: 28px;
background: url(../images/ico_i_sys.png) 0 -30px no-repeat;
margin-bottom:10px;
}
/**************************************************************************/
.footer1 {
height: 190px;
background-color:#061a31;
margin:20px 0px 0px 0px;
padding: 0px;
width: 1200px;
text-align: center;
display: block;
margin-left:10px;
}
.footer-ad {
padding: 0px;
margin: 0px;
width: 24.83%;
height: 70px;
background-color:#071f3c;
border: 1px solid #D5B362;
float: left;
display: block;
}
.footer-ad p {
margin-top: 4px;
color: #fff;
font-size: 18px;
}
.footer-ad-bottom{
position:relative;
}
.footer1 i {
display: block;
width: 900px;
height: 4px;
background-color: #fff;
overflow: hidden;
position:relative;
left: 140px;
top:55px;
clear: both;
z-index:;
}
.footer-ul {
height: 100%;
margin: 0px;
padding: 0px;
display: flex;
}
.footer-ul li {
margin-top: 10px;
padding: 0px;
z-index:;
margin: 0px auto;
padding: 0px;
display: inline-block;
}
.footer-bootom-radius {
width: 100px;
height: 100px;
border-radius: 50px;
float: left;
background-color: #fff;
padding: 0px;
margin-top: 5px;
}
.footer-bootom-radius span {
display: block;
font-size: 30px;
line-height: 36px;
margin-top: 22px;
}
/****************************************************************************/
.footer{
width:100%;
background-color: #020c18;
text-align: center;
padding-bottom: 20px;
}
.w1000{
width: 1000px;
margin:0px auto;
}
.ico{
height: 47px;
background:url(../images/ico.png) no-repeat;
}
.footer .flink {
text-align: center;
color: #434343;
height: 50px;
line-height: 50px;
}
.footer .flink a {
font-size: 12px;
font-family: "微软雅黑";
color: #fff;
margin: 0 10px;
transition: all 0.3s;
}
.footer .flink a:hover{
color: #ffcf2e;
}
.footer .copyright {
text-align: center;
color: #fff;
font-size: 12px;
font-family: "微软雅黑";
}
CSS背景图片设置的更多相关文章
- Bootstrap css背景图片的设置
一. 网页中添加图片的方式有两种 一种是:通过<img>标签直接插入到html中 另一种是:通过css背景属性添加 居中方法:水平居中的text-align:center 和 margin ...
- css样式背景图片设置缩放
一.背景颜色图片平铺 background-color 背景颜色 background-image 背景图片地址 background-repeat 是否平铺 默认是平铺 background-pos ...
- 利用wget 抓取 网站网页 包括css背景图片
利用wget 抓取 网站网页 包括css背景图片 wget是一款非常优秀的http/ftp下载工具,它功能强大,而且几乎所有的unix系统上都有.不过用它来dump比较现代的网站会有一个问题:不支持c ...
- css背景图片拉伸 以及100% 满屏显示
如何用css背景图片拉伸 以及100% 满屏显示呢?这个问题听起来似乎很简单.但是很遗憾的告诉大家.不是我们想的那么简单. 比如一个容器(body,div,span)中设定一个背景.这个背景的长宽值在 ...
- div css背景图片不显示
我们在写页面时,为了便于维护,css样式通常都是通过link外部导入html的,有时在css中写入背景图片时,此时背景图片的路径应该是相对css文件的.比如,此时的文件有index.html,css. ...
- Android TextView背景颜色与背景图片设置
Android TextView 背景颜色与背景图片设置,android textview 控件,android textview 背景, android textview 图片,android te ...
- JAVA GUI学习 - 窗体背景图片设置方法:重写paintComponent(Graphics g)方法
public class BackgroundImage extends JFrame { public BackgroundImage() { this.setTitle("窗体背景图片设 ...
- CSS背景图片定位
原文:CSS背景图片定位 在网页开发中我们经常需要对图片进行分割(如下图)来使用,而不是分别提供单独的图片来调用,常见的如页面背景,按钮图标等,这样做的好处就是减少请求次数,节省时间和带宽. 对背景图 ...
- 【IE6的疯狂之八】链接伪类(:hover)CSS背景图片有闪动BUG
IE6下链接伪类(:hover)CSS背景图片有闪动BUG,主要原因ie会再一次请求这张图片,或者说图片没被缓存. 例如: CSS代码 a:hover{background:url(imagepath ...
随机推荐
- sqlserver 数据保留固定位小数,四舍五入后保存
在实际业务中遇到金额保留四舍五入后,保留两位小数的需求.但是原来的数据是保留的6位小数,所以需要转化一下.具体实现过程如下: EG:SELECT CAST ( ROUND(1965.12540,2) ...
- Thinkphp中验证码不显示解决办法
1.页面是否存在bom头, 2.入口文件中是否有define(‘APP_DEBUG’, TRUE); //是否开启调试模式,上线时请改为false
- 密码学笔记——playfair密码
Playfair密码(Playfair cipher 或 Playfair square)一种替换密码,1854年由查尔斯·惠斯通(Charles Wheatstone)的英国人发明. 例题: 某种 ...
- 主席树板子 p2104
#include<cstdio> #include<algorithm> #include<vector> using namespace std; ; int n ...
- Nuxt项目文件目录结构解释
|-- .nuxt // Nuxt自动生成,临时的用于编辑的文件,build |-- assets // 用于组织未编译的静态资源入LESS.SASS 或 JavaScript |-- compone ...
- 【PAT甲级】1108 Finding Average (20分)
题意: 输入一个正整数N(<=100),接着输入一行N组字符串,表示一个数字,如果这个数字大于1000或者小于1000或者小数点后超过两位或者压根不是数字均为非法,计算合法数字的平均数. tri ...
- js加密(七)steam登录
1. url: https://store.steampowered.com/login/?redir=&redir_ssl=1 2. target: 登录 3. 分析 3.1 老样子,抓包, ...
- 1、TensorFlow如何工作?
TensorFlow特殊的张量计算引擎使得TensorFlow能够很好的满足机器学习的计算需要,从2015年开始发起 本书基于TensorFlow0.12+和python3.0+ 环境安装要求 pip ...
- Building Ethereum private chain on CentOS
golang安装 yum install golang 查看版本 go version 安装以太坊源代码 Building Geth (command line client) Clone the r ...
- LA 3708 墓地雕塑(模拟)
题目链接:https://vjudge.net/problem/UVALive-3708 这道题的思路也是比较难想. 首先根据上一题(Uva 11300)可知,要想让移动距离最短,那么至少要使一个雕塑 ...