Question

对不起，我真的是一个糟糕的程序员。我不明白我做错了什么...... CSS无效...... 谢谢!!!

<html>
<head>
<style type="text/css">

#main_table {
    height:100px;
    width: 300px;
    border-style:solid;
    border-width:1px;
    border-color:red;
};

.sub_table {
    text-align:center;
    background-color:yellow;
};

.image {
    margin-top:20px;
    padding:15px;
    max-width:300px;
};

</style>

</head>
<body>

  <div id="main_table">
    <div class="sub_table">
        <a href="http://www.google.com/">
            <img class="image" src="http://www.newyorker.com/online/blogs/photobooth/NASAEarth-01.jpg" alt="" />
        </a>
    </div>
    <div class="sub_table">
        <a href="http://www.google.com/">
            <img class="image" src="http://www.newyorker.com/online/blogs/photobooth/NASAEarth-01.jpg" alt="" />
        </a>
    </div>
  </div>

</body>
</html>

.image类无效...

Answer 1

用于此删除;，就像这样

#main_table {
    height:100px;
    width: 300px;
    border-style:solid;
    border-width:1px;
    border-color:red;
}

.sub_table {
    text-align:center;
    background-color:yellow;
}

.image {
    margin-top:20px;
    padding:15px;
    max-width:300px;
}

</style>

Answer 2

CSS解析器遇到非常糟糕的错误时会停止。在你的情况下，它是每个规则的右大括号之后的分号。

而不是这个

.sub_table {
    text-align:center;
    background-color:yellow;
};

使用此

.sub_table {
    text-align:center;
    background-color:yellow; 
}

<div>和<img/>标记</div>中的类和标识错误

2 个答案: