Question

我已经参加了一个HTML-CSS课程，而且我参加了其中一个最终作业，但我现在无法解决它一整天。 wc3的验证器说我的代码没有太大问题。问题首先是文本没有格式化为Bold和Italic，就像我在课堂上写的那样，第三个是没有框显示没有边框。

<html>
  <head>
    <STYLE TYPE="text/css" MEDIA=screen>
      p#speciell {
        font-style: italic;
      }

      p#speciell2 {
        font-weight : bold;
      }

      #DatorID {
        font-family : Helvetica, italic, underline;
        font-size : 25px;
        background : #ffffff;
        color : maroon;
      }

      .block3 { 
        font-family: Times New Roman;
        font-size: 16px;
        background: #c9e9ff;
        border: 6px #a52a2a
        border-style: double;
        border-color: #a52a2a;
        Padding: 5px;
        color: navy;
        width; 70%;
      }
    </STYLE>
    <LINK REL=StyleSheet HREF="style.css" TYPE="text/css" MEDIA=screen />
  </head>
  <body>
    <p class ="#speciell"> Text </p>
    <p class ="#speciell2"> Text </p>
    <div class="block">
      Text I want in a box with the formats
    </div>

Answer 1

那里有一些错误。

您有一个类block3的规则，您的元素有一个类block。不配。
您有ID speciell和speciell2的规则，您的元素包含类#speciell和#speciell2。没有匹配，而且您也以错误的方式使用#。它应该用于为某个元素ID定义规则。对于课程，您应该使用.。

修复这些问题，你得到：

<p class="speciell">Text</p> <!-- Removed the # from the class name -->
<p class="speciell2">Text</p> <!-- Removed the # from the class name -->
<div class="block">Text I want in a box with the formats</div>

和

p.speciell { /* Replaced the # that defines an ID with a . that defines a class */
    font-style: italic;
}
p.speciell2 { /* Replaced the # that defines an ID with a . that defines a class */
    font-weight : bold;
}
#DatorID {
    font-family : Helvetica, italic, underline;
    font-size : 25px;
    background : #ffffff;
    color : maroon;
}
.block { /* Corrected the class name */
    font-family: Times New Roman;
    font-size: 16px;
    background: #c9e9ff;
    border: 6px #a52a2a;
    border-style: double;
    border-color: #a52a2a;
    Padding: 5px;
    color: navy;
    width:70%; /* Corrected a typo */
}

Demo

CSS内联和嵌入式样式表

1 个答案: