html – 显示标题内联以下段落

html – 显示标题内联以下段落,第1张

概述给出以下语义标记: <h3> SCOPE OF WORK. </h3><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p><p>Ut enim ad minim veniam, quis 给出以下语义标记:
<h3> ScopE OF WORK. </h3><p>Lorem ipsum dolor sit amet,consectetur adipisicing elit,sed do eiusmod tempor incIDIDunt ut labore et dolore magna aliqua.</p><p>Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>

我想显示与段落内联标题,如下所示:

ScopE OF WORK. Lorem ipsum dolor sit amet,consectetur adipisicing
elit,sed do eiusmod tempor incIDIDunt
ut labore et dolore magna aliqua.

Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi
ut aliquip ex ea commodo consequat.

选项1:浮动标题.

只要标题适合一行,这就可以工作.如果没有,浮点形成一个宽块,所以段落从块的右边开始,或者在下面而不是继续内联:

| ScopE OF | Lorem || WORK     | ipsum || sit amet,consect|

选项2:内联显示两个元素.

样式规则如:h3,h3 * {display:inline;}可能有效.这假设它们先于&其次是块元素.否则,其他内联元素将流入其中.此外,相邻的选择器()并非在所有浏览器中都可用.

选项3?

无需添加不必要的类或包装元素,并使其保持有效&语义(段落中没有span.h3!),有没有更好的方法来做这个简单的事情?

解决方法
<!DOCTYPE HTML PUBliC "-//W3C//DTD xhtml 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-Transitional.dtd"><HTML xmlns="http://www.w3.org/1999/xhtml"><head><Meta http-equiv="Content-Type" content="text/HTML; charset=utf-8" /><Title>UnTitled document</Title><style>h3 {display:run-in;}p { display:block; }div { wIDth: 400px; }</style></head><body><div>    <h3> this is a Title </h3>    <p> this is a body of text,this is a body of text,this is a body of text</p>    <p> this is a body of text,this is a body of text</p></div></body></HTML>

这会将h3标签放入p标签中.
http://www.quirksmode.org/css/display.html在ie7或更低版​​本或firefox根本不工作,所以不是最好的解决方案

总结

以上是内存溢出为你收集整理的html – 显示标题内联以下段落全部内容,希望文章能够帮你解决html – 显示标题内联以下段落所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/web/1132993.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-30
下一篇 2022-05-30

发表评论

登录后才能评论

评论列表(0条)

保存