由于我在使用 Firefox 时遇到问题,无法通过使用 display:run-in; 将块元素按性质(标题)定位为内联;我在请求你的帮助!现在已经搜索了很长一段时间,但我找不到可以使用哪种 CSS 方法来代替仅应用 display:run-in; 到所有主要浏览器都支持的元素。以这种方式定位元素至关重要。
任何人都知道如何做到这一点的方法?
如果您想将元素显示为块元素,但会将其定位为 inline,那么
display: inline-block;
将为您解决问题。
MDN 仍然将run -in 列为实验值,所以如果它目前在 Firefox 中不能完全发挥作用,我们不应该太惊讶。
至于选项,您至少可以使用两个:display: inline
和display: inline-block
.
如果您不需要标题上的块元素的属性,则内联可能就足够了。Inline-block将其保留为块元素,因此您仍然可以做一些不错的事情,例如为其设置宽度、高度、边距等。
好吧,我找到了解决方案!:)display:inline;
与 with 结合使用float:left;
会使块元素本质上只使用他需要的空间,而不是 100% 的父元素。
如果您使用更大的字体让我们说一个标题并想在它之后添加一个段落(在同一行上),那么这种技术只有一个问题。如果标题font-size
稍大一点,标题可能会占用 2 行甚至更多行的高度空间,而段落文本应该是,并且标题和它下面的另一行段落之间会有一个小的间隙。解决方案是添加display:block;
和margin-top:Xpx;
到段落元素以根据需要对齐它。