会员可以在此提问,百战程序员老师有问必答
对大家有帮助的问答会被标记为“推荐”
看完课程过来浏览一下别人提的问题,会帮你学得更全面
截止目前,同学们一共提了 132647个问题
WEB前端全系列/第一阶段:HTML5+CSS3模块/前端入门与基础知识 33楼

.white-nav{

    width100%;

    height100px;

    background-color#fff;

    positionrelative;

}

.logo{

    width55px;

    height55px;

    background-color#ff6700;

    floatleft;

    margin-top22px;

    positionrelative;

    overflowhidden;

}

.nav-bar{

    width875px;

    height100px;

    line-height100px;

    floatleft;

}

.search{

    width296px;

    height100px;

    floatleft;

    positionrelative;

}

.logo>img{

    width100%;

    height100%;

    positionabsolute;

    transitionall 2;

}

.yang{

    left-55px;

}

.guo{

    left0;

}

.logo:hover>.yang{

    left0;

}

.logo:hover>.guo{

    left55px;

}

.yg{

    width142px;

    height88px;

}

.nav-bar li{

    floatleft;

}

.nav-bar>ul>li>a{

    color#333;

    padding0 10px;

}

.nav-bar>ul>li>a:hover{

    color#fff;

}

.nav-bar>ul>li:first-child img{

    margin-top22px;

}

.nav-bar-list{

    width100%;

    height229px;

    background-color#fff;

    border-top1px sold #eee;

    box-shadow0 3px 4px rgba(000.1);

    positionabsolute;

    top100px;

    left0;

    displaynone;

}

.img-box{

    width100%;

    height137px;

    margin-top35px;

    border-right1px solid #eee;

    box-sizingborder-box;

    margin-bottom16px;

}

.nav-bar-list{

    color#333;

    font-size12px;

    line-height20px;

}

.nav-bar-list li{

    width204px;

}

.nav-bar-list li:last-child .img-box{

    border-rightnone;

}

.nav-bar li:hover .nav-bar-list{

    displayblock;

}

.search>input{

    width244px;

    height50px;

    border1px solid #e0e0e0;

    box-sizingborder-box;

    padding0 10px;

    outlinenone;

    floatleft;

    border-rightnone;

    margin-top25px;

    transitionall 2s;

}

.search>button{

    width52px;

    height50px;

    border1px solid #e0e0e0;

    floatleft;

    margin-top25px;

    outlinenone;

    transitionall 2s;

}

.search>input:focus,.search>input:focus+button{

    border-color#b0b0b0;

}

.search>input:focus,.search>input:focus+button{

    border-color#b0b0b0;

}

.search>button:hover{

    background-color#ff6700;

    border-color#ff6700;

    color#fff;

}

.search-list{

    width245px;

    height241px;

    background-color#fff;

    border1px solid #ff6700;

    border-topnone;

    box-sizingborder-box;

    position: abso

老师,为啥我这个搜索框会从上往下移,这个框为啥会跑这里

image.png

WEB前端全系列/第一阶段:HTML5+CSS3模块/CSS3新特性 34楼

小米官网项目.zip

为什么加了z-index,“下载APP”和“购物车”里面的弹窗依旧被遮挡住

WEB前端全系列/第一阶段:HTML5+CSS3模块/商城官网项目 38楼

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        .nan{
         
            height: 450px;
            background-color: palegreen;
            float: left;
            padding: 10px;
            box-sizing: border-box;

        }
        .nan>div{
            width: 100%;
            height: 100%;
            background-color: red;
        }
        /* 移动端 */
        @media screen and (max-width: 768px) {
            .nan{
                width: 50%;
            }
        }
        /* ipad端 */
        @media screen and (min-width: 768px) and (max-width: 992px) {
            .nan{
                width: 33%;
            }
        }
        /* pc端 */
        @media screen and (max-width: 992px) {
            .nan{
                width: 25%;
            }
        }
    </style>
</head>
<body>
    <div class="box">
        <div class="nan">
            <div></div>
        </div>
        <div class="nan">
            <div></div>
        </div>
        <div class="nan">
            <div></div>
        </div>
        <div class="nan">
            <div></div>
        </div>
        <div class="nan">
            <div></div>
        </div>
        <div class="nan">
            <div></div>
        </div>
        <div class="nan">
            <div></div>
        </div>
        <div class="nan">
            <div></div>
        </div>
        <div class="nan">
            <div></div>
        </div>
        <div class="nan">
            <div></div>
        </div>
        <div class="nan">
            <div></div>
        </div>
        <div class="nan">
            <div></div>
        </div>
        <div class="nan">
            <div></div>
        </div>
    </div>
</body>
</html>
[object Object][object Object]

老师我这个是怎么回事你,我把他放大就是图1的样子,放小就是图2

WEB前端全系列/第一阶段:HTML5+CSS3模块/CSS盒子模型 39楼
WEB前端全系列/第一阶段:HTML5+CSS3模块/HTML5基础元素 40楼
WEB前端全系列/第一阶段:HTML5+CSS3模块/前端入门与基础知识 41楼
WEB前端全系列/第一阶段:HTML5+CSS3模块/HTML5基础元素 42楼
WEB前端全系列/第一阶段:HTML5+CSS3模块/HTML5基础元素 43楼
WEB前端全系列/第一阶段:HTML5+CSS3模块/浮动与定位 45楼

课程分类

百战程序员微信公众号

百战程序员微信小程序

©2014-2025百战汇智(北京)科技有限公司 All Rights Reserved 北京亦庄经济开发区科创十四街 赛蒂国际工业园
网站维护:百战汇智(北京)科技有限公司
京公网安备 11011402011233号    京ICP备18060230号-3    营业执照    经营许可证:京B2-20212637