博客
关于我
强烈建议你试试无所不能的chatGPT，快点击我
（初尝试京东页）京东的CSS文件。
阅读量：6836 次
发布时间：2019-06-26

本文共 18185 字，大约阅读时间需要 60 分钟。

hot3.png

下面是所有的京东css样式，图片我就不上传了，第一次尝试做京东页，难免会有一些错误和不足，可是 这也是起点。、。！下面是css代码：（有些代码没有备注，得结合上一篇博客结合着一起看。）

@charset "UTF-8";

.color_red {

    color: #FF0000;
}

.Header_Zong{

    width: 100%;
    background-color: #b135f5;
}
.header {
    height: 80px;
    width:1190px;
    overflow: -Scroll;
    overflow-y: hidden;
    position: relative;
}

.header_618 {

    height: 80px;
}

.header_1 {

    position: absolute;
    z-index: 1;
}

.header_bg {

    margin-left: 120px;
}

.logo {

    width:190px;
    height:170px;
    float:left;
    /* position: absolute;
    top: 80px;
    left: 120px;
    z-index: 10; */
    box-shadow: 1px -1px 6px #7e7e7e;
}
.Czx{
    width: 100%;
    height: 30px;
    background-color: #e2e3e4; 
}
Czx_1{
    background-color: #e2e3e4; 
}
/* LOGO右侧所有nav */
.Right_Zong{
    width:1000px;
    height:170px;
    float:left;
}

.nav_zong {

    width: 1190px;
    height: 30px;
    background-color: #e2e3e4; 
}

.nav {

    height: 30px;
    width: 1190px;
    margin-left: 0px;
}

.nav ul li {

    float: right;
    display: block;
    height: 30px;
    width: 80px;
    line-height: 28px;
    text-align: center;
}

.nav ul li a {

    color: #b4b5b5;
    font-size: x-small;
}

.nav ul li a:hover {

    color: #c14231;
    font-size: x-small;
}
/* 定位 */
.DingWei {
    margin-right: 40px;
}

.Shu {

    margin-left: 15px;
}

.Shu_1 {

    margin-left: 20px;
    color: #e2e3e4;
}
/* 右侧618 */
.Right_618 {
    position: fixed;
    top: 0px;
    right: 0px;
    z-index: 100;
}
/* 右侧固定定位 */
.Head_Shu{
    width:6px;
    height:100%;
    background-color:#797a7b;
    position:fixed;
    right: 0px;
    z-index: 1;
}
/* 右侧固定按钮上总 */
.Right_button_Zong{
    width:34px;
    height:216px;    
    position:fixed;
    top:300px;
    right: 1px;
    z-index: 1;
}
.Right_button_Zong_1{
    width:34px;
    height:35px;    
    background-color:#797a7b;
    border-radius: 3px;
    margin-bottom:1px;
}
.Right_button_Zong_1:hover{
    width:34px;
    height:35px;    
    background-color:#ff0000;
    
}
.Right_button_Zong_1 img{
    padding:6px;
    width:20px;
    height:20px;    
}
/* 右侧固定按钮下总 */
.Right_button_Zong1{
    width:34px;
    height:70px;
    top:711px;
    position:fixed;    
    right: 0px;
    z-index: 1;
}
.Right_button_Zong1_1{
    width:34px;
    height:35px;    
    background-color:#797a7b;
    border-radius: 3px;
    margin-bottom:1px;
}
.Right_button_Zong1_1:hover{
    width:34px;
    height:35px;    
    background-color:#ff0000;
}
.Right_button_Zong1_1 img{
    padding:6px;
    width:20px;
    height:20px;    
}
/* 搜索框 */
.search_Zong {
    height: 100px;
    width: 1190px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.search {

    width: 550px;
    height: 35px;
    margin-top: 25px;
    background-color: #FFFFFF;
    float: left;
}

.search_search {

    height: 35px;
    width: 50px;
    float: right;
    background-color: #de3029;
}

.search_search img {

    width: 50%;
    margin-top: 5px;
    margin-left: 13px;
}
/* 相机 */
.search_camera {
    margin-top: 7px;
    margin-left: 460px;
    width: 4%;
}
/* 间隔 */
.search_Kong_1 {
    width: 30px;
    height: 35px;
    float: left;
}

.search_Kong {

    width: 320px;
    height: 35px;
    float: left;
}
/* 购物车 */
.search_Shooping {
    width: 180px;
    height: 33px;
    float: left;
    margin-top: 25px;
    background-color: #FFFFFF;
    border: 1px solid #b4b5b5;
    text-align: center;
    color: #de3029;
    line-height: 33px;
    font-size: small;
}

.search_Shooping_icon {

    width: 8%;
}
/* 二维码 */
.search_QRcode {
    float: left;
}

.search_nav {

    width: 550px;
}

.search_nav ul li {

    float: left;
    width: 60px;
    line-height: 28px;
}

.search_nav ul li a {

    color: #b4b5b5;
    font-size: x-small;
}

.search_nav ul li a:hover {

    color: #c14231;
    font-size: x-small;
}

.Black_Zong{

    width:100%;
}
.black_zong {
    height: 40px;
    width: 1190px;
    overflow: -Scroll;
    overflow-y: hidden;
}
.black_zong ul li {
    float: left;
    width: 70px;
    line-height: 40px;
    text-align: center;
}

.black_zong ul li a {

    color: #000000;
    font-size: small;
}

.black_zong ul li a:hover {

    color: #ff0000;
    font-size: small;
}
/* 中间部分 */
.middle_Zong {
    width: 100%;
    height: 490px;
    background-image: url("../images/5b05a04cN69020713.png");
    background-repeat: no-repeat;
    background-position: -270px 0px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.middle {

    margin-left: 120px;
    margin-top: 1px;
    width: 1190px;
    height: 490px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.middle_left {

    margin-top: 1px;
    float: left;
    width: 190px;
    height: 490px;
    background-color: #ffffff;
    padding-top: 15px;
}

.middle_left ul li {

    height: 26px;
    font-size: small;
    line-height: 26px;
    color: #8b898a;
}

.middle_left ul li:hover {

    background-color: #d9d9d9;
}

.middle_left ul li a {

    color: #8b898a;
}

.middle_left ul li a:hover {

    color: #ff0000;
}

.middle_middle {

    float: left;
    margin-left: 9px;
    margin-top: 10px;
    width: 591px;
    height: 480px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.middle_middle img {

    width: 591px;
    height: 480px;
}
/* 中间三个竖排的div广告 */
.middle_height {
    overflow: -Scroll;
    overflow-y: hidden;
    float: left;
    margin-left: 9px;
    margin-top: 10px;
    width: 190px;
    height: 480px;
}

.middle_height_img {

    width: 190px;
    margin-bottom: 10px;
}

.middle_right {

    float: right;
    margin-left: 9px;
    margin-top: -55px;
    width: 190px;
    height: 480px;
    background-color: #FFFFFF;
    box-shadow: 0px 6px 5px #8b898a;
}

.middle_right_top {

    height: 160px;
}
/* 圆形头像 */
.TouXiang {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    background-color: #e3e1df;
    text-align: center;
    position: relative;
    left: 2px;
    /* margin-top:-50px; */
    /* 添加阴影 靠左0 靠上5 和6px阴影范围 阴影颜色为灰色 */
    box-shadow: 1px 5px 7px #8b898a;
}

.TouXiang img {

    margin-top: 5.5px;
    width: 80%;
    border-radius: 50%;
}
/* 头像下面文字 */
.hello {
    margin-top: 66px;
    text-align: center;
    color: #8b898a;
    font-size: small;
}

.hello a {

    color: #8b898a;
}

.hello a:hover {

    color: #ff0000;
}

.Xinrenfuli {

    text-align: center;
    float: right;
    height: 25px;
    width: 70px;
    margin-top: 10px;
    margin-right: 10px;
    border-radius: 10px;
    font-size: small;
    line-height: 25px;
    box-shadow: 1px 5px 5px #8b898a;
}

.Xinrenfuli:hover {

    background-color: #ce312f;
}

.Xinrenfuli a {

    color: #8b898a;
}

.Xinrenfuli a:hover {

    color: #FFFFFF;
}

.Huiyuan {

    text-align: center;
    float: right;
    margin-top: 10px;
    margin-right: 25px;
    height: 25px;
    width: 70px;
    border-radius: 10px;
    background-color: #363634;
    font-size: small;
    line-height: 25px;
    box-shadow: 1px 5px 5px #8b898a;
}

.Huiyuan:hover {

    background-color: #ce312f;
}

.Huiyuan a {

    color: #dab98b;
}

.Huiyuan a:hover {

    color: #FFFFFF;
}
/* 最右侧中间部分 */
.middle_right_middle ul li {
    width: 60px;
    float: left;
    font-size: small;
    text-align: center;
}

.middle_right_middle a {

    color: #8b898a;
}
/* 其中的一个下边框 */
.li_1 {
    display: block;
    border-bottom: 2px solid #ff0000;
}

.middle_right_middle_note {

    margin-top: 10px;
    margin-left: 10px;
}

.middle_right_middle_note li a {

    color: #8b898a;
    height: 24px;
    font-size: small;
}
/* 下面的 话费机票样式 */
.middle_right_bottom ul li {
    width: 45px;
    float: left;
    font-size: x-small;
    height: 24px;
    line-height: 24px;
    text-align: center;
}

.middle_right_bottom a {

    color: #8b898a;
}

.middle_right_bottom_1 ul li {

    width: 60px;
    float: left;
    font-size: x-small;
    height: 24px;
}

.middle_right_bottom_1 a {

    color: #000000;
}
/* 杂碎的东西 */
.za {
    margin-left: 10px;
    font-size: x-small;
    color: #8b898a;
}
/* 快速充值按钮 */
.Kuansucongzhi {
    text-align: center;
    margin: 10px 0px;
    height: 25px;
    width: 70px;
    border-radius: 10px;
    background-color: #FF0000;
    font-size: small;
    line-height: 25px;
}

.Kuansucongzhi a {

    color: #FFFFFF;
}
/* 秒杀div */
MiaoSha_ZongDiv{
    height: 275px;
    width: 100%;
    overflow: -Scroll;
    overflow-y: hidden;
}
.MiaoSha_Zong {
    margin-top: 30px;
    height: 275px;
    width: 1190px;
    overflow: -Scroll;
    overflow-y: hidden;
    z-index: 0;
}

.MiaoSha_1 {

    float: left;
    width: 190px;
    height: 275px;
    background-color: #d6463c;
    text-align: center;
    color: #FFFFFF;
}

.MiaoSha_1 img {

    width: 50px;
}
/* 小黑格子 */
.MiaoSha_block_Zong {
    margin-top:0px;
    width: 44px;
    height: 40px;
    float: left;
}

.MiaoSha_block {

    margin-top: 1px;
    margin-left: 5px;
    width: 39px;
    height: 19px;
    background-color: #000000;
}
/* 数字 */
.Mb_1 {
    
    width: 15px;
    color: #FFFFFF;
    font-size: 0.8cm;
    position: absolute;
    left: 10px;
}

.Mb_2 {

    width: 15px;
    color: #FFFFFF;
    font-size: 0.8cm;
    position: absolute;
    left: 27px;
}

.Mb_3 {

    width: 15px;
    color: #FFFFFF;
    font-size: 0.8cm;
    position: absolute;
    left: 53px;
}

.Mb_4 {

    width: 15px;
    color: #FFFFFF;
    font-size: 0.8cm;
    position: absolute;
    left: 70px;
}

.Mb_5 {

    width: 15px;
    color: #FFFFFF;
    font-size: 0.8cm;
    position: absolute;
    left: 96px;
}

.Mb_6 {

    width: 15px;
    color: #FFFFFF;
    font-size: 0.8cm;
    position: absolute;
    left:113px;
}
/* ------------------ */
.MiaoSha_2 {
    float: left;
    margin-right: 1px;
    width: 199px;
    height: 275px;
    text-align: center;
    background-color: #FFFFFF;
    overflow: -Scroll;
    overflow-y: hidden;
}

.MiaoSha_2 span {

    display: block;
    margin-top: 5px;
    font-size: small;
}

.MiaoSha_2 img {

    width: 199px;
}
/* 秒杀价 */
.MiaoSha_2_red {
    background-color: #FF0000;
    float: left;
    width: 80px;
    height: 20px;
    text-align: center;
    color: #FFFFFF;
    line-height: 20px;
}
/* 秒杀价原价 */
.MiaoSha_2_writ {
    background-color: #FFFFFF;
    float: left;
    width: 80px;
    height: 20px;
    text-align: center;
    color: #8a8a8a;
    line-height: 20px;
    text-decoration: line-through;
}
/* 浮动箭头 */
.left_Jt {
    background-color: #d9d9d9;
    position: relative;
    top: 85px;
    right: 90px;
    width: 20px;
    height: 40px;
}

.left_Jt img {

    text-align: center;
    width: 20px;
    height: 40px;
    width: 20px;
}

.right_Jt {

    background-color: #d9d9d9;
    position: relative;
    top: 79px;
    left: 89px;
    width: 20px;
    height: 40px;
}

.right_Jt img {

    text-align: center;
    width: 20px;
    height: 40px;
}
/*主会场样式*/
.meeting-place {
    float: left;
    width: 1314px;
    height: 571px;
    margin-top: 30px;
    background-image: url("../images/5b0405acN7d7b504a.png");
}
/* 带左浮动的内容 */
.meeting-place_note_Zong {
    width: 100%;
}

.meeting-place_note_margin {

    float: left;
    margin: 10px 10px 10px 390px;
    width: 174px;
    height: 209px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note_margin img {

    width: 174px;
    height: 209px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note_margin img:hover {

    width: 174px;
    height: 209px;
    opacity: 0.7;
    filter: alpha(opacity = 70);
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note {

    float: left;
    margin: 10px 10px 10px 0px;
    width: 174px;
    height: 209px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note img {

    width: 174px;
    height: 209px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note img:hover {

    width: 174px;
    height: 209px;
    opacity: 0.7;
    filter: alpha(opacity = 70);
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note_margin_1 {

    float: left;
    margin: 0px 10px 10px 390px;
    width: 174px;
    height: 209px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note_margin_1 img {

    width: 174px;
    height: 209px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note_margin_1 img:hover {

    width: 174px;
    height: 209px;
    opacity: 0.7;
    filter: alpha(opacity = 70);
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note_1 {

    float: left;
    margin: 0px 10px 10px 0px;
    width: 174px;
    height: 209px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note_1 img {

    width: 174px;
    height: 209px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note_1 img:hover {

    width: 174px;
    height: 209px;
    opacity: 0.7;
    filter: alpha(opacity = 70);
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note_margin_2 {

    float: left;
    margin: 0px 10px 10px 390px;
    width: 174px;
    height: 109px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note_margin_2 img {

    width: 174px;
    height: 109px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note_margin_2 img:hover {

    width: 174px;
    height: 109px;
    opacity: 0.7;
    filter: alpha(opacity = 70);
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note_2 {

    float: left;
    margin: 0px 10px 10px 0px;
    width: 174px;
    height: 109px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note_2 img {

    width: 174px;
    height: 109px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.meeting-place_note_2 img:hover {

    width: 174px;
    height: 109px;
    opacity: 0.7;
    filter: alpha(opacity = 70);
    overflow: -Scroll;
    overflow-y: hidden;
}
/* 下一个分支 */
.grid_c1 {
    height: 450px;
    width: 1190px;
    overflow: -Scroll;
    overflow-y: hidden;
}

.box_top {

    float: left;
    width: 390px;
    height: 430px;
    background: #fff;
}

.box_top_hd {

    height: 50px;
    padding: 0 17px;
}

.box_top_hd img {

    display:block;
    float:left;
    margin-top:13px;
    width: 23px;
    height: 23px;
}

.box_top_hd a {

    color: #666;
    text-decoration: none;
}

.box_tit {

    float:left;
    margin-right:5px;
    font-size: 20px;
    line-height: 50px;
}

.box_subtit {

    font-size: 14px;
    width: 135px;
    height: 30px;
    line-height: 50px;
    margin: 7px 0 0 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.tab_item ul li {

    float: left;
    font-size: x-small;
    text-align: center;
    line-height: 30px;
    width: 78px;
    height: 30px;
    background-color: #f7f7f7;
}

.tab_item ul li a {

    color: #8e8e8e;
}

.tab_item ul li a:hover {

    color: #ff0000;
}

.tab_body {

    width: 100%;
    height: 300px;
    background-color: #FFFFFF;
}

.tab_body_1 {

    width: 350px;
    height: 100px;
    margin: 0 20px;
}

.tab_body_1 img {

    width: 88px;
    height: 88px;
    float: left;
}

.tab_Number {

    float: left;
    width: 30px;
    height: 40px;
    margin: 25px 0 0 10px;
    color: #e74240;
    line-height: 40px;
    font-size: 34px;
    text-align: center;
    font-family: 'impact';
}

.top_item_name {

    display: block;
    padding-top: 30px;
    height: 32px;
    line-height: 16px;
    font-size: 12px;
    overflow: hidden;
    color: #333;
}
/* hr分界线 */
.tab_hr {
    width: 350px;
    height: 2px;
    margin: 0 20px;
    background-color: #909090;
}
/* 小红点 */
.tab_circle {
    margin: 0 auto;
    line-height: 32px;
    width: 370px;
    height: 32px;
    text-align: center;
    poiotion: absolute;
}
/* 实心 */
.tab_circle_1 {
    position: relative;
    left: 165px;
    margin-top: 9px;
    margin-left: 10px;
    float: left;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #FF0000;
}
/* 空心 */
.tab_circle_border {
    position: relative;
    left: 165px;
    margin-left: 10px;
    float: left;
    margin-top: 8.5px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    border: 1px solid #7c7c7d;
}
/* 三个div的外边距 */
.m_1 {
    float: left;
    margin-left: 10px;
}

.middle_box {

    width: 283px;
    height: 130px;
}

.middle_box_img {

    width: 283px;
    height: 130px;
}

.middle_box_img_1 {

    width: 261px;
    height: 100px;
}

.middle_box_img_1 img {

    float: left; width : 87px;
    height: 87px;
    width: 87px;
}
/* 中间图片下面的标题 */
.middle_box_sp {
    margin-top: 10px;
    margin-bottom: 10px;
    width: 261px;
    text-align: center;
}

.middle_box_sp a {

    color: #000;
}
/* 中间图片下面的标题 */
.middle_box_note {
    width: 261px;
    text-align: center;
    font-size: small;
    margin-bottom: 3px;
}
.middle_box_note_1 {
    width: 261px;
    height:100px;
    text-align: center;
    font-size: small;
    margin-bottom: 3px;
}
.middle_box_note a {
    color: #7c7c7d;
}
/* 优惠券 */
.coupon_item {
    width: 284px;
    height: 110px;
    background-color: #f6f6f6;
    border-radius: 7px;
    poiotion: absolute;
}

.coupon_img {

    border-radius: 50%;
    width: 80px;
    height: 80px;
    margin-top: 10px;
    margin-left: 10px;
    float: left;
}
/* 价钱 */
.coupon_price span {
    width: 157px;
    font-family: 'impact';
    display: block;
    height: 38px;
    line-height: 38px;
    color: #f00;
}

.coupon_limit {

    margin-left: 5px;
    color: #b1b3b0;
    font-size: 14px;
}

.coupon_desc {

    margin-left: 5px;
    color: #767b77;
    font-size: 14px;
}
/* 更多好券 */
.coupon_more {
    float: right;
    height: 100px;
    line-height: 118px;
    font-size: 12px;
    width: 35px;
    color: #333;
}

.coupon_more_inner {

    display: inline-block;
    width: 11px;
    height: 110px;
    line-height: 15px;
    vertical-align: middle;
}
/* 相对定位的小圆 */
.tab_circle_2 {
    position: relative;
    top: 10px;
    left: 80px;
    margin-top: -20px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #FFF;
}
/* 夏天样式 */
.sunning{
    width:350px;
    height:195px;
}
.sunning_img{
    width:350px;
    height:195px;
}
/* 四个图片总 */
.ForImg_zong{
    width:350px;
    height:170px;
    text-align:center;
}
.ForImg_zong_img{
    
    float:left;
    width:170px;
}
.ForImg_zong_img_a1 {
    font-size:15px;
    color:#ff0000;
}
.ForImg_zong_img_a2 {
    font-size:15px;
    color:#528a94;
}
.ForImg_zong_img img{
    margin-left:12.5px;
    width:140px;
    height:140px;
}
/* 右侧一张大图片三张小图片 */
.box_right{
    width:380px;
    height:260px;
}
.box_right img{
    width:380px;
    height:260px;
}
/* 下面三个小图片 */
.box_right_img{
    margin-top:10px;
    margin-left:5px;
    float:left;
    width:123px;
    height:100px;
}
.box_right_img img{
    width:125px;
    height:100px;
}
/* 极速先锋 */
.floorhd{
    width:100%;
    height:65px;
}
/* 中间的div */
.floorhd_looer{
    widht:1190px;
    height:45px;
}
/* 标题 */
.floorhd_looer_tit{
    width:300px;
    height:45px;
    font-family: 'impact';
    text-align:center;
    
}
/* 浮动箭头 */
.box_left_Jt {
    margin-top:-40px;
    background-color: #d9d9d9;
    position: relative;
    top: 245px;
    right: 185px;
    width: 20px;
    height: 40px;
}

.box_left_Jt img {

    text-align: center;
    width: 20px;
    height: 40px;
    width: 20px;
}

.box_right_Jt {

    background-color: #d9d9d9;
    position: relative;
    top: -219px;
    left: 185px;
    width: 20px;
    height: 40px;
}

.box_right_Jt img {

    text-align: center;
    width: 20px;
    height: 40px;
}
/* 一个大图两个小图模版div */
.sp_tit{
    width:350px;
    height:180px;
    margin-bottom:10px;
}
.sp_tit img{
    width:350px;
    height:180px;
}
.sp_bottom{
    float:left;
    width:170px;
    height:180px;
}
.sp_bottom img{
    width:170px;
    height:180px;
}
/* 右侧带5px边框的div */
.box_border{
    margin-top:30px;
    float:right;
    border:5px solid #000;
    width: 330px;
    height: 390px;
    
}
.box_border_img{
    background-color:#f1f3ef;
    position: absolute;
    woidth:300px;
    height:400px;
}
/* 定位空背景 */
.box_bg{
    width: 380px;
    height: 430px;
    
}
/*    下一层*/
.Box_middle{
    float: left;
    width: 390px;
    height: 430px;
}
.Box_border_img{
    background-color:#f1f3ef;
    position: absolute;
    margin-left:30px;
    woidth:300px;
    height:400px;
}
.Box_border{
    margin-top:30px;
    float:left;
    border:5px solid #000;
    width: 330px;
    height: 390px;
}
.Box_top_hd{
height: 100px;
    padding: 0 17px;
}
.Box_top_hd img{
    float:left;
    width:128.5px;
    height:60px;
    border:1px solid #000;
    margin-top:20px;
}
.Box_top_hd span{
    float:left;
    display:block;
    height:100px;
    line-height:100px;
    margin-left:10px;
    font-family: 'impact';
    color:#000;
}
/* 中间四个div样式 */
.Four_St{
    width:390px;
    height:210px;
    margin-bottom:10px;
}
.Four_St_bottom{
    float:left;
    width:190px;
    height:210px;
    text-align:center;
    background-color:#FFF;
}
.Four_St_bottom img{
    margin-top:15px;
    width:100px;
    height:100px;
}
Four_St_bottom_p1 a{
    font-size:medium;
    color:#626262;
}
.Four_St_bottom_p2 a{
    font-size:larger;
    color:#fd3727;
}
/* 三个图样式 */
.Sp_tit{
    width:350px;
    height:180px;
    margin-bottom:10px;
}
.Sp_bottom{
    float:left;
    width:110px;
    height:110px;
}
.Sp_bottom img{
    width:110px;
    height:110px;
}
/* 第三行 */
.HuanJi_img{
    width:350px;
    height:190px;
    margin-bottom:20px;
}
.HuanJi_img img{
    width:350px;
    height:190px;
}
/* 单击变淡 */
.BianDan:hover{
    opacity:0.6;
    transition:opacity .2s linear;
}

 

转载于:https://my.oschina.net/ZxArvin/blog/1826483

你可能感兴趣的文章
你可能不需要一个 JavaScript 框架（二）
查看>>
【Android】显示Emoji表情字符
查看>>
C++ Exercises（十八）
查看>>
21.5. 流量控制
查看>>
WSRP调用中的一些问题
查看>>
Android 正则表达式
查看>>
5.22. Spring boot with Cache
查看>>
[裴礼文数学分析中的典型问题与方法习题参考解答]4.3.13
查看>>
string Join
查看>>
布线须知：机柜在数据中心机房的三个新用途
查看>>
迁移到云：渐进但不可逆转
查看>>
Patchwork间谍组织将目标扩大至政府
查看>>
工业物联网为“两化融合”带来巨大推力
查看>>
《UNIXLinux程序设计教程》一3.7　非阻塞I/O
查看>>
IBM遭标普下调评级
查看>>
手机短信验证码真的安全吗？
查看>>
关于智慧城市建设的几点建议
查看>>
Facebook高管：我们是科技公司 不是媒体公司
查看>>
《领域特定语言》一2.3DSL的问题
查看>>
TensorFlow 1.0 正式发布 你需要知道的都在这里
查看>>
喝酒易醉，品茶养心，人生如梦，品茶悟道，何以解忧？唯有杜康！-- 愿君每日到此一游！
当前时间: 2025-01-31 20:09:55   当前IP: 3.14.128.200   联系邮箱:javaeecc@qq.com     Copyright © 2020 - 2022 baihongyu.com 京ICP备2021015314号-2
强烈建议你试试无所不能的CHAT-GPT，快点击我
强烈建议你试试无所不能的CHAT-GPT，快点击我