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

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        #container {
            display: grid;
            grid-template-columns: 200px 200px 200px;
            grid-template-rows: 200px 200px 200px 200px 200px;
            grid-template-areas: "item1 item1 item1"
                                 "item2 item3 item4"
                                 "item5 item5 item6"
                                 "item7 item8 item8"
                                 "item9 item9 item9";

        }

        .item {
            font-size: 35px;
            text-align: center;
            border: 1px solid #e5e4e9;
        }

        .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新特性 451楼

<style>

        .body{
            background-color: #d0cdcd;
        }

</style>

css设定更改浏览器背景颜色为灰色，但是运行时在浏览器内没有生效，缓存跟network设置后还是不能生效

WEB前端全系列/第一阶段：HTML5+CSS3模块/初识CSS 452楼

<body>
    <div class="box">
        <a href="#">
            <img src="../img/魅族大图.png" alt="">
            <span class="title">魅族 18</span>
            <span class="intro">高通骁龙 888 ｜162g 6.2英寸轻妙手感</span>
            <span class="price">￥4399</span>
            <div class="sub">新品</div>
        </a>
        
    </div>
    <div class="box1">

    </div>
</body>

这是HTML

WEB前端全系列/第一阶段：HTML5+CSS3模块/CSS选择器 453楼

老师我写完之后对不齐啊

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

1、HTML是不是不可以对表格的边框线添加颜色？

WEB前端全系列/第一阶段：HTML5+CSS3模块/HTML5基础元素 455楼

为啥箭头引入不进去

WEB前端全系列/第一阶段：HTML5+CSS3模块/CSS应用技巧 456楼

只设置了box的左外边距和上外边距，为什么最右侧也有空隙呢，设置总宽度时如果不考虑这个空隙，8个box就会下移

WEB前端全系列/第一阶段：HTML5+CSS3模块/初识CSS 457楼

我觉得每台电脑的屏幕大小都不一样，会影响测量的准确度，我自己的解决方法是将一个网页打开，用F12测量实际的大小，再用自己的工具测量，将两个结果的比例求出来，进行网页缩放调整，例如我自己的工具就需要在页面缩放为67%的情况下才比较准确。

然后就是雪碧图的部分，可以先创建个div设置img在网页上打开，调到67%再用工具在上面进行测量，这样我测试过能更准地抓到想要的那部分的内容。

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

老师我想问一下就是我点那个下载app二维码被挡住了还有那个

购物车也是然后那个slide不是应该定位到wrap 吗不知道为什么给定到黑色导航去了最后我也不知道鼠标悬浮在白色导航的字为什么没显示颜色

小米官网实战.rar

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

就是看视频和老师代码一样但是我的就出现问题了

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

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

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

比如说“你好，很高兴见到你”这段话，我想要加粗的同时增加斜体效果，标签要如何使用

WEB前端全系列/第一阶段：HTML5+CSS3模块/HTML5基础元素 462楼

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
  <style>
.box{
    width: 200px;
    height: 200px;
    background: red;
    padding: 50px;
    border:20px solid green;
    margin: 50px;
    box-sizing: border-box;
}

  </style>
</head>
<body>
    <div class="box"></div>
</body>
</html>

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

老师您好，请问这个ps 2019cc是已经破解的吗？

https://mp.weixin.qq.com/s/ACJhJ9D5E6JiGGEThsNSsA

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

老师，我想问一下这里的
.box{
        width="100px"
        height="100px"
        margin="50px"
        border="5px"
        padding="20px"
}
当设置了border后，那margin距离.box还是50px吗？还是距离border是
50px？
当设置了内边距后，.box被撑开，那.box的width和height应该发生了
改变，是否和上面设置的height和width冲突

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

同学您好