Question

我在网上搜索了我的问题的答案。当然，这引出了我关于stackoverflow的一些主题。我尝试了提供的解决方案，但到目前为止我还没有成功！有人请你好好快速浏览一下我的html＆amp; CSS？这是侧边栏ID。我已经将背景颜色定义为红色，因此您不应该错过它。

<!DOCTYPE HTML>
<html lang="nl">
    <head>
        <meta charset="utf-8" />
        <title>Eenmaal Andermaal</title>
        <link rel="stylesheet" type="text/css" href="style.css">
        <style type="text/css">
            table { 
                border-spacing:10px;
            }

            <!---Veiling foto's--->
            .imgBig {
                width: 252px;
                height: 252px;
            }

            .imgSmall {
                width: 80px;
                height: 80px;
            }

            #enlarged {
                float:left;
            }

            #thumbnails {
                float:left;
            }

            <!---Bod bar--->
            #sidebar {
                float:left;
                width:272px;
                height:739px;
                background-color:red;
            }

            <!---Links--->
            a {
                text-decoration:none;
                color:#535f79;
            }

            a:hover {
                text-decoration:underline;
            }
        </style>
    </head>

    <body>
        <h2>Titel van deze veiling</h2>

        <table>
            <tr>
                <td>Voorwerpnummer:</td><td>7324474820</td>
            </tr>
        </table>

        <!--Foto's-->

        <div id="enlarged">
            <img class = "imgBig" src = "img\versterker.jpg" alt="">
        </div>

        <div id="thumbnails">
            <table>
                <tr>
                    <td>
                        <a href="img\versterker.jpg"><img class = "imgSmall" src = "img\versterker.jpg" alt=""></a>
                    </td>
                    <td>
                        <a href="img\versterker.jpg"><img class = "imgSmall" src = "img\versterker.jpg" alt=""></a>
                    </td>
                </tr>

                <tr>
                    <td>
                        <a href="img\versterker.jpg"><img class = "imgSmall" src = "img\versterker.jpg" alt=""></a>
                    </td>
                    <td>
                        <a href="img\versterker.jpg"><img class = "imgSmall" src = "img\versterker.jpg" alt=""></a>
                    </td>
                </tr>
            </table>
        </div>

        <!--Biedingen-->
        <div id="sidebar">
            <table>
                <tr>
                    <td>Verkoper:</td><td>Gebruiker793</td>
                </tr>

                <tr>
                    <td>Locatie:</td><td>Arnhem</td>
                </tr>

                <tr>
                    <td>Beoordeling:</td><td></td>
                </tr>

                <tr>
                     <td><a href>Neem contact op met verkoper</a></td><td></td>
                </tr>

                <tr>
                    <td>Geplaatst:</td><td>22-11-2013 11:00</td>
                </tr>

                <tr>
                    <td>Looptijd:</td><td>7 dagen</td>
                </tr>
            </table>
        </div>

    </body>
</html>

Answer 1

由于评论，CSS无效：这是一条HTML评论。

CSS Syntax - 4.1.9 Comments

[在CSS中]注释以字符“/ ”开头，以字符“ /”结尾。它们可能出现在其他令牌之外的任何地方，其内容对渲染没有影响。评论可能不会嵌套。

Working Example

更新了CSS

table {
    border-spacing:10px;
}
/* Veiling foto's */
 .imgBig {
    width: 252px;
    height: 252px;
}
.imgSmall {
    width: 80px;
    height: 80px;
}
#enlarged {
    float:left;
}
#thumbnails {
    float:left;
}
/* bod bar */
 #sidebar {
    float:left;
    width:272px;
    height:739px;
    background-color:red;
}
/* Links */
 a {
    text-decoration:none;
    color:#535f79;
}
a:hover {
    text-decoration:underline;
}

Answer 2

评论的格式应为/ *评论* /

写：

table {
    border-spacing:10px;
}
/*Veiling foto's*/
 .imgBig {
    width: 252px;
    height: 252px;
}
.imgSmall {
    width: 80px;
    height: 80px;
}
#enlarged {
    float:left;
}
#thumbnails {
    float:left;
}
/*Bod bar*/
 #sidebar {
    float:left;
    width:272px;
    height:739px;
    background-color:red;
}
/*Links*/
 a {
    text-decoration:none;
    color:#535f79;
}
a:hover {
    text-decoration:underline;
}

Fiddle here.

Answer 3

您对html使用了错误的评论。对于CSS，您需要/* Comment goes here*/。

您的标记也无效。我认为您的图片来源应该是img/versterker.jpg而不是img\versterker.jpg

我的div中的背景颜色没有显示出来

3 个答案: