对齐副标题“恰到好处”标题下方

发布于 2024-12-06 18:11:14 字数 611 浏览 1 评论 0原文

我很困惑这样的事情应该如何做。我能够用 html 和 css 布局整个网站，但是当涉及到这样的事情时，我开始怀疑我是否以正确的方式做。

有人可以帮我吗？我试图在宽度为 25% 的 div 内的某个位置放置一个 H1 和一个 H3（或 H2）（如下所示）？

非常感谢任何帮助，谢谢！

PS 我有点想这样？：

<div class="yipeee">
   <h1 style="float:left; position:absolute; top:2; left:2;">This is a pretty awesome heading</h1>
   <h3 style="float:right; position:absolute; bottom:2; right:2;"><i>if only it were better than this sub-heading...</i></h3>
</div>

原文

I'm very confused about how things like this should be done. I am able to layout a whole site with html and css, but when it comes to things like this, I begin to doubt whether i'm doing it the right way or not.

Can somebody please help me? I am trying to have a H1 and a H3 (or H2) laid out (as shown below) somewhere inside a div that is 25% wide?

Any help is much appreciated, and thank you!

http://tinypic.com/r/2wd5bfl/7

P.S.
I was kinda thinking something like this?:

<div class="yipeee">
   <h1 style="float:left; position:absolute; top:2; left:2;">This is a pretty awesome heading</h1>
   <h3 style="float:right; position:absolute; bottom:2; right:2;"><i>if only it were better than this sub-heading...</i></h3>
</div>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

若言繁花未落 2024-12-13 18:11:14

不确定这是否是您所要求的，但这是给定示例的解决方案：

<h1 id="heading">This is a pretty awesome heading</h1>
<h2 id="subheading">If only it were better than this subheading</h2>

<style type="text/css">
h1#heading { font-size: 36px; font-weight: bold; }
h2#subheading {
    margin-left: 25%;
    font-style: italic;
}
</style>

请参阅处的 jsFiddle 示例http://jsfiddle.net/fausak/WmuRf/

Not sure if this is what you're asking for, but here's a solution for the given example:

<h1 id="heading">This is a pretty awesome heading</h1>
<h2 id="subheading">If only it were better than this subheading</h2>

<style type="text/css">
h1#heading { font-size: 36px; font-weight: bold; }
h2#subheading {
    margin-left: 25%;
    font-style: italic;
}
</style>

See the jsFiddle example at http://jsfiddle.net/fausak/WmuRf/

回复收藏 0 原文