Question

我正在学习HTML / CSS并决定试试这个：

<p>A paragraph with no margins specified.</p>
<div style="width=300px; height=300px; background-color:yellow;><p>This paragraph is in a divider.</p></div>
<p>A paragraph with no margins specified.</p>

经过一些谷歌搜索，我发现你不能改变内联元素的宽度/高度。因此，我尝试使用<div>将<p>和display:block同时转换为块元素，但这并没有改变任何内容。宽度在屏幕外无限移动，高度仅与<p>一样高。我希望在300x300 <p>中有<div>，我该怎么办呢？另外，为什么这些方法都不起作用（即使我改为display:block）？谢谢。
另外，我知道你不应该像我一样使用过多的CSS。这只是因为我正在使用W3的“自己动手”HTML编辑器测试内容。

Answer 1

代码中的错误：

<div style="width=300px; height=300px; background-color:yellow;>
-----------------^-------------^-------------------------------^
                  Replace with :                               Missing "

你错了。将=替换为:，您错过了"：

<div style="width:300px; height:300px; background-color:yellow;">

Answer 2

默认情况下，div和p都是块元素，因此您无需为它们指定display:block;。您在样式属性中使用了旧式html属性名称/值设置（名称=值）。

您需要在样式属性中使用类似name:value;的属性。

style="width:300px; height:300px; background-color:#FFFF00;"

您可能想看一下Team Treehouse的一些资源：http://teamtreehouse.com/library/websites/build-a-simple-website/website-basics

或Code School：http://www.codeschool.com/paths/html-css

希望这有助于您继续学习。

Answer 3

您也可以尝试使用“max-width”而不仅仅是“width”。

无法更改<div> </div>的高度/宽度

3 个答案: