Question

我正在开发我的网站，但我遇到了一些问题。在我的电脑上，我可以看到我想要的网站，但是当我在笔记本中看到内容非常正确时！在我的电脑是正常的。我有网站供你查看。这是葡萄牙语，因为我是巴西人。但请看一下源代码。或者更好，我会为你传递代码。权利内容的CLASS是：content-inner-jogo-destaque 这是代码： CSS：

.content-inner-jogo-destaque
{
position:absolute;
top:15px;
right:15px;
width:200px;
background-color: #ffffff;
padding: 10px 10px;
-webkit-box-shadow: inset 0 0 10px #1f325d;
-o-box-shadow: inset 0 0 10px #1f325d;
-moz-box-shadow: inset 0 0 10px #1f325d;
-ms-box-shadow: inset 0 0 10px #1f325d;
box-shadow: inset 0 0 10px #1f325d;
border-left: 3px solid #eeeeee;
border-right: 3px solid #eeeeee;
border-bottom: 3px solid #eeeeee;
border-top: 3px solid #eeeeee;
}

HTML：

<body>
<div class='content-inner-jogo-destaque'>
<p>Jogo da semana:</p>
<a href="testando"><img src="imagens/semana1.jpg" title="Clique para ir para a 
p&aacute;gina do jogo da semana" style="width:200px"/></a>
<font size="3"><font face="verdana,geneva">Dragon Ball Z Budo<font size="3">kai Tenkaichi 3</font></font></font>
</div>
</body>

嗯，这是网站：www.ganggames.p.ht 请看看，如果出现问题，请告诉我。我可以使用CSS来更改网站的像素吗？还是metatag？你能帮助我吗？谢谢！：）

Answer 1

我有三件事要你：

1）我认为您的内容显示在您页面右侧的主要原因是因为您的内容设置为“position：absolute”然后您告诉它保持15px从页面右侧。这意味着无论您的屏幕有多大或多小，DIV总是距离页面右侧15px。

如果您将所有内容包装在具有设定宽度的DIV中，则可以保留当前的代码：

<head>
    <style>#wrapper {width: 'whatever-your-content-width-is';}</style>
</head>
<body>
    <div id="wrapper">
        <!--ALL OF YOUR CONTENT-->
    </div>
</body>

如果你想要（可选），你现在也可以整齐地集中所有内容：

<style>body {text-align: center;}</style>

2）对于跨设备兼容性，帮助查看问题的标准是此元标记：

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

可以在此处找到对该标签的进一步研究： https://developer.mozilla.org/en-US/docs/Mobile/Viewport_meta_tag

3）仔细检查你的所有BODY，HEAD，FOOTER等标签！它们没有正确执行。

希望这有帮助！

如何标准化我的网站的视图模式？

1 个答案: