有效沟通问答-【官方】百战程序员_IT在线教育培训机构

会员可以在此提问，百战程序员老师有问必答

对大家有帮助的问答会被标记为“推荐”
看完课程过来浏览一下别人提的问题，会帮你学得更全面

截止目前，同学们一共提了 132358个问题

时间排序推荐排序

为什么会报错啊？

WEB前端全系列/第一阶段：HTML5+CSS3模块/响应式项目 106楼

.btn 的margin-top是10.5应该是（66-（43+1+1））÷2算出来的吧，视频说得有问题

WEB前端全系列/第一阶段：HTML5+CSS3模块/响应式项目 107楼

我只用了绝对定位left，没有用margin-left,动画也没有用display，而是给颜色设置透明，最后效果差不多，这样可以吗？

            <div class="tria"></div>

.tria{
    width: 0;
    height: 0;
    border-bottom: 8px solid transparent;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    position: absolute;
    bottom: 0;
    left: 33%;
    transition: all 0.05s;
}
.black-nav-left li:hover>.tria{
    border-bottom: 8px solid #fff;
}

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

到底什么时候需要用form表单包裹呢，为什么有的input被包裹，有的没有被包裹。输入框不需要form吗？

WEB前端全系列/第一阶段：HTML5+CSS3模块/表单 109楼

老师，白色导航的下拉列表中图片外为什么要包裹一个div

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

我的button标签为什么默认box-sizing不是content-box而是border-box

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

老师，我的搜索框用一个div承载了一个input和一个button，宽度设置的刚好够两个的宽度和，为什么button会跳到下一行呢

 <div class="search">
                <input type="text" placeholder="笔记本">
                <button class="iconfont">
                    &#xe63d;
                </button>
            </div>

.search{
    width: 296px;
    height: 50px;
    float: right;
    margin-top: 25px;
    position: relative;
}

.search button{
    width: 38px;
    height: 46px;
    padding: 1px 6px;
    border: 1px solid #e0e0e0;
    background-color: #fff;
    font-size: 24px;
    line-height: 46px;
    color: #616161;
    box-sizing: content-box;
    transition: all .2s;
    cursor: pointer;
}

.search input{
    width: 223px;
    height: 48px;
    padding: 0 10px 0;
    border: 1px solid #e0e0e0;
    font-size: 14px;
    line-height: 48px;
    border-right: 0;
    transition: all .2s;
    outline: none;
}

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

<!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>
        #container {
            display: grid;
            grid-template-columns: 200px 200px 200px;
            grid-template-rows: 200px 200px 200px 200px 200px 200px;
            grid-template-areas: "item1 item1 item2"
                                 "item1 item1 item3"
                                 "item3 item3 item3"
                                 "item4 item5 item6"
                                 "item7 item8 item9"
                                 "item9 item9 item9";
        }

        .item{
            font-size: 30px;
            border: 1px solid #e5e4e9;
            text-align: center;
            line-height: 200px;
        }

        .item-1 {
            grid-area: item1;
            background-color: #ef342a;
        }

        .item-2 {
            grid-area: item2;
            background-color: #f68f26;
        }

        .item-3 {
            grid-area: item3;
            background-color: #4ba946;
        }

        .item-4 {
            grid-area: item4;
            background-color: #0376c2;
        }

        .item-5 {
            grid-area: item5;
            background-color: #c077af;
        }

        .item-6 {
            grid-area: item6;
            background-color: #f8d29d;
        }

        .item-7 {
            grid-area: item7;
            background-color: #b5a87f;
        }

        .item-8 {
            grid-area: item8;
            background-color: #d0e4a9;
        }

        .item-9 {
            grid-area: item9;
            background-color: #4dc7ec;
        }
    </style>
</head>

<body>
    <div id="container">
        <div class="item item-1">1</div>
        <div class="item item-2">2</div>
        <div class="item item-3">3</div>
        <div class="item item-4">4</div>
        <div class="item item-5">5</div>
        <div class="item item-6">6</div>
        <div class="item item-7">7</div>
        <div class="item item-8">8</div>
        <div class="item item-9">9</div>
    </div>
</body>

</html>

为什么我的代码运行出来效果不对

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

老师为什么设置cellspacing=0后，下边框还是有两个边框

WEB前端全系列/第一阶段：HTML5+CSS3模块/表单 114楼

为什么relative也是相对于设置position属性的父级元素进行定位？不只有absolute是这样的吗？relative难道不是相对于自身的定位？

WEB前端全系列/第一阶段：HTML5+CSS3模块/浮动与定位 115楼

也没搜索到

WEB前端全系列/第一阶段：HTML5+CSS3模块/前端入门与基础知识 116楼

设置—Emment里面没有use online completions

WEB前端全系列/第一阶段：HTML5+CSS3模块/前端入门与基础知识 117楼

老师，有没有什么属性或者说什么方法让div的padding 和border 属性不撑开div？

比如说:

一个盒子的宽高200px,给盒子一个border：1px; 内边距10px ;

不设置其他属性时，最终的盒子宽高变成211px,

怎么让盒子维持宽高200px?

WEB前端全系列/第一阶段：HTML5+CSS3模块/CSS盒子模型 118楼

<!DOCTYPE html>

<head>

<title>Document</title>

<style>

.box {

width: 100%;

height: 50px;

background-color: gray;

}

.nav {

width: 80%;

height: 50px;

margin: 0 auto;

line-height: 50px;

}

.nav ul li {

list-style: none;

float: left;

padding: 0 30px;

}

.nav ul li a {

text-decoration: none;

font-size: 20px;

color: red;

}

</style>

<style>

@media screen and(max-width:916px) {

.liu {

display: none;

}

@media screen and(min-width:916px) {

.liu {

display: block;

}

</style>

</head>

<body>

<ul>

</ul>

<ul>

</ul>

<ul>

</ul>

<ul>

</ul>

<ul>

</ul>

<ul>

</ul>

</div>

</body>

</html>

能这样隐藏其中一个li标签吗？

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

老师这个内容为什么会被遮挡呢？

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

同学您好