Question

我正在开发一个直接的HTML 5网站进行学习。

在我的CSS看起来像之前：

div.BoxHouse {
  margin-left: 72px;
  margin-right: 20px;
}

#content {
  width: 90%;
  background: url(transwhite.png);
  border: 1px solid #3F4933;
  margin-left: 72px;
  margin-right: 20px;
  margin-top: 20px;
  padding: 5px;
  z-index: 1;
  margin-bottom: 40px;
  overflow:auto;
  top: 10em;
  padding-top: 10px;
  }

我认为使用HTML5我可以在代码中执行此操作：

<header>  
<hgroup>
    <content>
    <BoxHouse>
        <h1>HTML 5</h1>  
        <h2>The mark-up language for fun and profit</h2>
    </BoxHouse>
    </content>
</hgroup>

鉴于此为新CSS：

BoxHouse {
  margin-left: 72px;
  margin-right: 20px;
}

content {
  width: 90%;
  background-image: url('../transwhite.png');
  border: 1px solid #3F4933;
  margin-left: 72px;
  margin-right: 20px;
  margin-top: 20px;
  padding: 5px;
  z-index: 1;
  margin-bottom: 40px;
  overflow:auto;
  top: 10em;
  padding-top: 10px;
  }

但它显然不起作用。我做错了什么？

Answer 1

您无法在HTML5中使用自定义标记。您应该直接在CSS中选择h1，h2等，或者使用它们上的类。

<header class="content">  
<hgroup class="BoxHouse">
    <h1>HTML 5</h1>  
    <h2>The mark-up language for fun and profit</h2>
</hgroup>

此外，background-image: url(transwhite.png);图片是半透明的白色背景吗？如果是这样，你可以在CSS3中使用RGBA颜色。这是为了阿尔法。因此，您可以将background-color: rgba(255,255,255,0.5);用于50％透明白框。这比使用不透明度的优点是文本不透明，它仍然清晰而坚固。

Answer 2

你要做的事情很有意义。但这不是CSS的工作方式。

您可以劫持像＆lt; em＆gt;这样的广告标签和＆lt; strong＆gt;保持你的HTML简洁，但你不能创建新的。而是使用用户友好＆lt; span class =“myclass”＆gt; ...

HTML5和CSS - 自定义标签？

2 个答案: