gpt4 book ai didi

html - 我的页眉和
不对齐有问题

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

我是网络开发的新手,我正在为我学校的一个俱乐部制作一个网站。这是http://crsclub.org

我试图让标题文本在顶部 div 的整个页面中居中,而根本不承认图片。我在那里找到了主要文本,据我所见,我认为其他所有内容也会消失。

基本上,Computer Repair and Share Club 下面的文字应该都居中,“曼彻斯特社区学院”和所有链接。

我在所有事情上都使用表格,但代码非常困惑,我的 friend 告诉我永远不要在这种事情上使用表格。

谁能告诉我我做错了什么?

这是我的 header.php(包含在我网站的每个页面上,带有 php include)

<!DOCTYPE html>
<html>
<head>
<title>CRS Club <?php echo $page; ?></title>
<script src="/resources/jquery.js"></script>
<script src="/resources/konami.js"></script>
<link rel="stylesheet" type="text/css" href="main.css">
</head>

<body>
<div class="boxed_header disable-select" style="float:center;">
<div class="absolute" style="float:left; width:20%">
<img src="http://crsclub.org/images/logo.png" height="142" width="142" />
</div>

<div class="absolute center">
<div style="width:80%">
<h1>Computer Repair and Share Club</h1>
<h4>of Manchester Community College</h4>
</div>
<div style="width:80%">
<a align=center href="http://crsclub.org">Home</a> | <a align=center href="http://crsclub.org/links.php">Links</a> | <a href="http://crsclub.org/events.php">Events</a> | <a href="http://crsclub.org/contact.php">Contact Us</a> | <a href="http://crsclub.org/diagnostics.php">Self-Help</a> | <a href="http://crsclub.org/services.php">Our Services</a>
</div>
</div></div>

<xfs class="disable-select">
<br></xfs>

这是我的 CSS

body {background-color: #454079;}<!--#161058!-->

/*Header properties, Absolute keeps items in any position on page.*/
.absolute {
position:absolute;}
td{min-width:142px;}
.center {margin:auto;}

/*Disable header dragging mess.*/
.disable-select {-webkit-user-select: none;
-moz-user-select: none;-ms-user-select: none;
user-select: none;}
img {pointer-events: none;}

/*Fonts*/
p.sansserif{font-family:Arial,Helvetica,sans-serif;}

/*For bottom content boxes.*/
div.content{width:60%;
min-width:420px;
border:solid 2px #1A1A1A;
border-radius:5px;
padding:10px;
margin-left:auto;
margin-right:auto;
background-color:#F1F1F1;}
.border{border:solid 1px #000000;}

/*Link formatting.*/
.lks {text-align: center;}
a:link {color:blue;text-decoration:none;}
a:visited {color:blue;text-decoration:none;}
a:hover {color:#00008A;}

/*Table formatting.*/
h1 {color:black; text-align:center; vertical-align:text-top; font-family:verdana; font-size:28; }
td {vertical-align: top;}
table {background-color: #F1F1F1}
.boxed_header {border:2px solid #a1a1a1;padding:10px 40px;
background:#F1F1F1;border-radius:14px;}
.boxed_body {border:0px solid #a1a1a1;background:#F1F1F1;width:50%;border-radius:14px;margin:auto;}

摆弄: http://jsfiddle.net/9FkK4/

老实说,我已经尝试了很多,也投入了很多时间,但我无法弄清楚。

此外,这是我的旧标题,它看起来就像我希望它在客户端看起来的样子,但表格非常困惑。

<body>
<table>
<tr><td>
<a href="index.php"><img src="images/logo.png" height="142" width="142"/></a>
</td>
<td width=100% align=center>
<h1>Computer Repair and Share Club</h1>
<a align=center href="index.php">Home</a> | <a align=center href="links.php">Links</a> | <a href="events.php">Events</a> | <a href="contact.php">Contact Us</a> | <a href="diagnose.php">Diagnostics</a> | <a href="services.php">Our Services</a>
</td></tr></table>
<hr>
</body>

最佳答案

将 h1 上方的 div 更改为 100% 并添加 text-align:center;我认为您应该在真正发布该元素之前了解更多标记。

关于html - 我的页眉和 <div> 不对齐有问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20160121/

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