gpt4 book ai didi

html - 网页 - 标题中的文本定位

转载 作者:太空宇宙 更新时间:2023-11-04 14:01:24 25 4
gpt4 key购买 nike

我试图将文本放置在同一行上,但我在执行此操作时遇到了问题。我想要实现的是屏幕左上角和屏幕右上角的一些文本,显示指向其他 URL 的链接。这是我目前所拥有的:

enter image description here

这是我想要实现的:

enter image description here

任何人都可以提供有关如何实现此目标的任何建议吗?谢谢

代码如下:

<style type="text/css">
@font-face /* support for browsers & IE v10 onwards*/
{font-family:homefont; src: url("font.ttf");}
{font-family:headerfont; src: url("playball.ttf");}
body {background:url('img/mybackgroundHD.jpg') no-repeat center center fixed;}
<!-- Make Header Sticky -->
#header_container {background:#00E5EE; border:0px solid #666; height:70px; left:0; position:fixed; width:100%; top:0;}
<!-- HEADER text -->
#header{padding: 0.3em 0; border-bottom: 0px; overflow: hidden; zoom: 1; line-height:0px; margin:0 auto; width:940px; text-align:left;display:inline-block; float:right;}
#wrapper{width:900px;margin:0 auto;}
a{color:#444;text-decoration: none;}
.logo{margin-left:600px;margin-top:100px;background:#fff;padding:10px;}
.bigtitle{font-family: homefont; font-size:150px; color:#000; text-transform:uppercase; text-shadow:4px 1px 1px #444; text-align:center; margin-top:200px; opacity:0.6;}
.header{top:100%; left:0%; font-family: headerfont; font-size:20px; color:#FFFFFF; font-style:italic; padding-top:0px; padding-bottom:0px; padding-right:20px; padding-left:0px;}
</style>
</head>
<body>

<!-- BEGIN: Sticky Header -->
<div id="header_container">

<div id="header"><p class="header"> Follow me on:

<a style="margin:0;" href="https://www.facebook.com/chilunliuTheBOSSE">
<img src="/img/facebook-lnk.gif" alt="alt text" style="border:none; width="40" height="40"></a>

<a style="margin:0;" href="https://plus.google.com/u/0/+chilunliu/posts/p/pub">
<img src="/img/googleplus-lnk.gif" alt="alt text" style="border:none; width="40" height="40"></a>

<a style="margin:0;" href="http://www.linkedin.com/pub/chilun-liu/1b/297/416">
<img src="/img/linkedin-lnk.gif" alt="alt text" style="border:none; width="40" height="40"></a>

<a style="margin:0;" href="">
<img src="/img/email-lnk.gif" alt="alt text" style="border:none; width="40" height="40"></a>

<a style="margin:0;" href="http://www.youtube.com/user/chilunliu">
<img src="/img/youtube-lnk.gif" alt="alt text" style="border:none; width="40" height="40"></a>

</div>
</p>

</div>
<!-- END: Sticky Header -->

<div id="wrapper">
<h2 class="bigtitle">
<p>
Chilun Liu
</p>
</h2>
</div>

</body>
</html>

最佳答案

放入<div id="header-container">两个 div:

<div id="subheader-left" style="float:left>Follow me on</div>
<div id="subheader-right" style="float:right; text-align:right"> your images here </div>

关于html - 网页 - 标题中的文本定位,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21484322/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com