0

我的名字是 Will，我正在为一些人编写一个网站。我遇到了一点错误。无论我使用哪种代码，网站都不会正确地将其自身调整为页面。例如，这是它在大屏幕上的样子：

http://i.stack.imgur.com/B5KLX.jpg

一般来说，看起来还可以。然而，在我看来，两侧的两个元素之间的巨大空间非常糟糕，并且营造出一种对比度和间距都很差的环境。

这是它在小屏幕上的外观：

http://i.stack.imgur.com/y0HFI.jpg

也一般看起来没问题。接受应该在右侧的缺少的滚动条。从较小的计算机上拍摄的照片是我希望网站在所有计算机上的样子，尽管我需要一个滚动条。

这是该页面的代码：

<HTML>
<HEAD>
<h1><font color="#000000" size="+1"><marquee  direction="right" bgcolor="green"       scrollamount="3">Website BETA: Version 1.0</marquee></font></h1>
<link rel="stylesheet" type="text/css" href="css.css">
<div class="fadeIn">
<center>
<div style="display: inline-block;" id="red">
<h1>Hinte's  </h1>
</div>
<div style="display: inline-block;" id="white">
<h1>Liberty  </h1>
</div>
<div style="display: inline-block;" id="blue">
<h1>Theatre</h1>
</div>
</center>
</div>
<br>
<div id='cssmenu'>
<ul>
   <li class='active'><a href='index.html'><span>Home</span></a></li>
   <li class='active'><a href='art.html'><span>Art</span></a></li>
   <li class='active'><a href='biography.html'><span>Biography</span></a></li>
   <li class='last'><a href='contact.html'><span>Contact Us</span></a></li>
</ul>
</div>
<link rel="shortcut icon" href="favicon.ico">
</HEAD>
<br>
<br>
<br>
<body background="grayscale.jpg">
<div style="position:fixed;top:20em;left0em;right:4em;" id="text60">
<p>Gary Edward Hinte</p>
</div>
<div style="position:fixed;top:26em;left0em;right:7em;" id="text30">
<p>American Political Artist</p>
</div>
<div style="position:fixed;top:22em;left:1em;right:40em;">
<img class="grayBox" style="border: 0px solid black;
            border-radius: 10px;
            -moz-border-radius: 10px;
            -khtml-border-radius: 10px;
            -webkit-border-radius: 10px;" width="600px" height="500px" src="JulianA.jpg">
</div>
</body>
<title>HLT - Home</title>
</HTML>
4

3 回答 3

0

对不起，您的网站设置错误。尝试这个。

<html>
    <title>Page Name</title>
    <meta tags />
    <styles that you need to link to />

    <body>
    anything you want people to see goes here!!!
    <scripts go here />
    </body>
</html>

此外，没有 CSS 也无法帮助您，并且要正确显示您的元素，它们必须像我向您展示的那样放置。

如果您希望您的网站看起来相同或有些相同，您需要使用 %%%% 来设置元素的样式，以便它们响应窗口大小。

要对齐您的元素，请考虑使用：位置、边距、填充、左上和右下。

于 2013-11-14T02:32:39.917 回答
0

尝试创建一个包装器并将您的 div 像这样放在 BODY 中

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
  <link rel="stylesheet" type="text/css" href="css.css">
<title>HLT - Home</title>
  </head>
  <body>


<h1><font color="#000000" size="+1"><marquee  direction="right" bgcolor="green"       scrollamount="3">Website BETA: Version 1.0</marquee></font></h1>

<div id="wrapper">

<div class="fadeIn">
<center>
<div style="display: inline-block;" id="red">
<h1>Hinte's  </h1>
</div>
<div style="display: inline-block;" id="white">
<h1>Liberty  </h1>
</div>
<div style="display: inline-block;" id="blue">
<h1>Theatre</h1>
</div>
</center>
</div>
<br>
<div id='cssmenu'>
<ul>
   <li class='active'><a href='index.html'><span>Home</span></a></li>
   <li class='active'><a href='art.html'><span>Art</span></a></li>
   <li class='active'><a href='biography.html'><span>Biography</span></a></li>
   <li class='last'><a href='contact.html'><span>Contact Us</span></a></li>
</ul>
</div>
<link rel="shortcut icon" href="favicon.ico">
</HEAD>
<br>
<br>
<br>
<body background="grayscale.jpg">
<div style="position:fixed;top:20em;left0em;right:4em;" id="text60">
<p>Gary Edward Hinte</p>
</div>
<div style="position:fixed;top:26em;left0em;right:7em;" id="text30">
<p>American Political Artist</p>
</div>
<div style="position:fixed;top:22em;left:1em;right:40em;">
<img class="grayBox" style="border: 0px solid black;
            border-radius: 10px;
            -moz-border-radius: 10px;
            -khtml-border-radius: 10px;
            -webkit-border-radius: 10px;" width="600px" height="500px" src="JulianA.jpg">
</div>


</div> <!--closing wrapper-->
</body>
</html>

并将其添加到您的 css 文件中

#wrapper {
width:1200px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
于 2013-11-14T02:46:53.917 回答
0 
<html>
  <head>
     <title>HLT - Home</title>
     <link rel="icon" type="image/png" href="favicon.png" />
     <link href="css.css" rel="stylesheet" type="text/css" />
  </head>

<body>
<!--All of your content in here-->

</body>
</html>

如果您也放置样式表，我将不胜感激，也不要复制和粘贴整个文档。只是您遇到问题的部分

我会推荐一些 HTML 和 CSS 教程。你有错误的想法。一个body元素是除了导入和东西之外所有内容的地方。元素是导入和标题和内容的head去处，而不是您想要显示的内容。

最后，我对您为什么还要使用样式表感到困惑。您似乎正在使用所有这些旧方法在 HTML 中进行样式设置。例如： center并且font您将大部分样式直接应用到元素中。

在较小的图片上以您想要的方式将其居中。我会在max-width: 1280px;您的样式中添加一个，或者在您的正文部分中的所有内容周围创建一个具有指定宽度的容器 DIV。

希望这有帮助

于 2013-11-14T01:25:30.113 回答