个人中心
gpt4 book ai didi

使用 CSS 类时，嵌套 Div 中的 HTML 嵌套 Div 不显示

转载 作者：太空宇宙 更新时间：2023-11-04 10:13:50 26 4
gpt4 key购买 nike

以下代码有一个 Div，其中连续包含四个较小的 Div。四个 Div 中的每一个还包含一个较小的 Div，但此 Div 未显示。我尝试了各种显示和位置组合，看看 div 是否会出现。 classGoalSelected 中似乎有问题。

<html>

<head>

    <style type="text/css">

        #goalSelectionContainer {

            width: 70%;
            background: #eee;
            margin: 10px auto;
            position: relative;
            text-align:center;
        }                

        .classGoalSelection {
            background: grey;
            height: 100px;
            width: 100px;
            position: relative;
            display:inline-block;
            margin: 10px;
            }                
        }

        .classGoalSelected {
            background-color:green; 
            width:25px; 
            height:25px;
            position: relative;
            display:inline-block

        }

    </style>

</head>

<body>

    <div id = "goalSelectionContainer" >
        <div id = "goalSelectHome" class = "classGoalSelection">Home

            <div id = "goalSelectedHome" class = "classGoalSelected">   
            </div>


        </div>

        <div id = "goalSelectRetire" class = "classGoalSelection">Retirement

            <div id = "goalSelectedRetire" class = "classGoalSelected">             
            </div>

        </div>

        <div id = "goalSelectCollege" class = "classGoalSelection">College

            <div id = "goalSelectedCollege" class = "classGoalSelected"> 
            </div>
        </div>   

        <div id = "goalSelectOther" class = "classGoalSelection">Other

            <div id = "goalSelectedOther" class = "classGoalSelected">
            </div>

        </div>          

    </div>



</body>

</html>

使用这行代码

<div style="background-color:green; width:50%; height:50px;display:inline-block;"> </div>

用类代替此代码将导致出现 Div。

<div id = "goalSelectedHome" class = "classGoalSelected"></div>

最佳答案

那是因为你的 css 中有一个额外的 '}'。发生在我们最好的人身上

 .classGoalSelection {
            background: grey;
            height: 100px;
            width: 100px;
            position: relative;
            display:inline-block;
            margin: 10px;              
        }

这应该行得通!!

关于使用 CSS 类时，嵌套 Div 中的 HTML 嵌套 Div 不显示，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37382205/

26 4 0
文章推荐： python - repr() of dict, but ordered
文章推荐： linux - 在输出 grep 的地方保留新行
文章推荐： java - Spring 依赖注入(inject)在 ConstraintValidator 中不起作用
文章推荐： linux - Chef Recipe - 用 sed 命令替换 Linux 文件中的文本(接收错误)
太空宇宙
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com