Css 如何在a<；中设置此div和link的样式；李>；标签？

我有li元素的样式，所以它有一定的高度，并填充整个屏幕的宽度。问题是中的div与li>具有相同的垂直高度。我尝试添加pad或margin，它会在div和li之间创建一个间隙，但如果有意义的话，会增加li元素的高度

我该如何使div变小？垂直地它有一个背景色，这就是我如何看到它所占据的空间

第二，当我尝试在div中向右浮动锚点时，它不起作用

最后，我想在div里面有一个img标签，但是当我把它放进去的时候，它工作了，但是锚链接出现在它下面

---

我知道我好像什么都不知道，但这些东西似乎不在我的书里。非常感谢您的帮助。

它应该可以工作-您只有一个小的语法错误，请更改以下内容：

<li> <div class="test"><a href="example">Dummy</a> </div></li>

到

按照目前的方式，该div没有封装任何内容。（如果你发布你的CSS类

.test

，我相信我自己或其他人会很乐意为你树立一个有用的榜样。）

示例：

---

（在没有任何想法的情况下你可能会寻找什么）

你的CSS将非常有帮助

有一件事我可以告诉你，神秘的高度可能是由于盒子模型-这几乎是90%的CSS和布局。长方体模型规定某事物的真实宽度或高度基于边距+边框+填充+内容。因此，如果您有一个元素具有如下样式的CSS：

<div class="test">

它的实际高度和宽度是122px。。。5px（左边框）+1px（左边框）+5px（左填充）+100px（内容）+5px（右填充）+1px（右边框）+5px（右边框）

我知道这并不能准确回答你的问题，但希望它能帮助你更好地理解正在发生的事情。所以，再看看你的CSS，看看额外的高度/宽度是从哪里来的

您可以了解有关长方体模型的详细信息：

---

**还有一些折页边距，解释起来有点复杂，但您可以找到它们

您可能需要更改div的结束标记，您当前正在定义class=“test”后关闭它。它应该是相反的，如果你能显示你目前拥有的CSS，它会有所帮助。图像相对于文本有多大，它像子弹吗？你根本不需要div，li可以完成造型，你在li里面有div是有原因的吗？请尝试将您的代码粘贴到JSFIDLE中，以便我们查看。向我们展示您目前使用的内容。@Alien:完全不正确。示例：

div{height:0；}

很抱歉，源代码中没有明显的打字错误。我已经改正了。很抱歉，这是我注意到的第一件事。测试类是什么样子的？

<div class="test">

div{margin:5px; border-width:1px; padding:5px; width:100px; height:100px;}