我正试图在http://jsfiddle.net上解决我的问题并且在那里有最奇怪的行为。你能解释一下这些(http://jsfiddle.net/C6V3S/)垂直边距从何而来吗？出现在jsfiddle.net上(至少在Chrome和FF中)，复制/粘贴到本地独立文件时不出现...在更改为简单block后工作正常独立测试文件示例:.btn{填充:0px；边框:1px纯红色；显示:内联block；.txt{display:inline-block;width:12px;height:12px;border:none;padding:0;margin:0;background:#77FF7

请考虑以下HTML代码:test.section{display:inline-block;border:1pxdashedblue;}.outer{border:1pxdashedred;margin:10px;}a1A1Bb2345由于类为“.section”的两个div具有相同的高度，并且是行内block，所以我希望它们都垂直对齐。但是，这些div中的第一个被向下推，因此文本“1B”与其他部分的文本行“5”对齐。在任一div中添加或删除行都会直接影响我的第一部分的垂直位置。我看不出这是什么逻辑，在CSS3官方文档中也找不到答案。然而，它似乎并不是一个错误，因为它在Chrome8、

请考虑以下HTML代码:test.section{display:inline-block;border:1pxdashedblue;}.outer{border:1pxdashedred;margin:10px;}a1A1Bb2345由于类为“.section”的两个div具有相同的高度，并且是行内block，所以我希望它们都垂直对齐。但是，这些div中的第一个被向下推，因此文本“1B”与其他部分的文本行“5”对齐。在任一div中添加或删除行都会直接影响我的第一部分的垂直位置。我看不出这是什么逻辑，在CSS3官方文档中也找不到答案。然而，它似乎并不是一个错误，因为它在Chrome8、

我想设计如下图的东西，但不知道该怎么做!三点标题所以我只想在标题下方的中心显示3个点。但是当我尝试使用dotted时border-bottom它需要整个标签。h1{text-align:center;font-size:50px;color:red;border-bottom:10pxdottedred;}MyTitle 最佳答案 为此使用了::after伪元素h1{text-align:center;font-size:50px;color:red;line-height:30px;}h1::after{content:"..."

我想设计如下图的东西，但不知道该怎么做!三点标题所以我只想在标题下方的中心显示3个点。但是当我尝试使用dotted时border-bottom它需要整个标签。h1{text-align:center;font-size:50px;color:red;border-bottom:10pxdottedred;}MyTitle 最佳答案 为此使用了::after伪元素h1{text-align:center;font-size:50px;color:red;line-height:30px;}h1::after{content:"..."

这个问题在这里已经有了答案:Howtoremovethespacebetweeninline/inline-blockelements?(41个回答)关闭7年前。我有三个并排水平堆叠的div，这些div设置为显示:inline-block。但是，我注意到即使使用某种CSS重置，它们之间也会产生4px的小距离？为什么会发生这种情况？有没有办法在全局范围内避免这种情况发生，或者我只需要将div向左移动-4像素？

这个问题在这里已经有了答案:Howtoremovethespacebetweeninline/inline-blockelements?(41个回答)关闭7年前。我有三个并排水平堆叠的div，这些div设置为显示:inline-block。但是，我注意到即使使用某种CSS重置，它们之间也会产生4px的小距离？为什么会发生这种情况？有没有办法在全局范围内避免这种情况发生，或者我只需要将div向左移动-4像素？

我想实现以下位置:两个不同的文本(在block中)float/内嵌在图像旁边。(div中的所有内容)。我一直在尝试不同的显示设置(block+内联文本等)，但它仍然无法正常工作。HTML:"/>TITLEeDescriptionCSS:.res{height:60px;background-color:yellow;border-bottom:1pxsolidblack;text-align:left;}.resimg{margin-top:8.5px;margin-left:5px;display:inline}.resspan{display:block;}

我想实现以下位置:两个不同的文本(在block中)float/内嵌在图像旁边。(div中的所有内容)。我一直在尝试不同的显示设置(block+内联文本等)，但它仍然无法正常工作。HTML:"/>TITLEeDescriptionCSS:.res{height:60px;background-color:yellow;border-bottom:1pxsolidblack;text-align:left;}.resimg{margin-top:8.5px;margin-left:5px;display:inline}.resspan{display:block;}

是不同于以任何方式？它们渲染得一样好。两者在语义上有什么区别吗？ 最佳答案 是的，它们是不同的。即使您使用display:block为span设置样式，您仍然不能将block级元素放入其中:correctwrong无论CSS如何改变，(X)HTML仍然必须遵守(X)HTMLDTD(无论您使用哪个DTD)。 关于html-按原样的DIV与显示:block的SPAN之间的区别，我们在StackOverflow上找到一个类似的问题： https://stackove