-1

谷歌如何调整其搜索引擎？似乎任何屏幕分辨率，搜索栏始终居中，其上方是徽标，下方是按钮。我希望我的搜索引擎完全一样，唯一的问题是它似乎在更大的分辨率上向右移动但在我的 Macbook Pro 上很好？

有任何想法吗？我的CSS代码如下：

.searching {
  position:relative;
  top:-60px;
  left:-30px;
  background-color:#EBEAE2;
  color:#000000;
  font-family:Trebuchet MS; 
  font-weight:normal; 
  font-size:16px; 
  width:800px;
}
.logo {
  posistion:relative;
  margin-top:30px;
  margin-left:270px;
}
.qlickbutton {
  position:relative;
  top:-42px;
  left:10px;
  height:50px;
  width:70px;
} 


<img src="Qlick1.png" class="logo" id="logo" width="600" height="300"> 

<form action='search2.php' method='get' autocomplete="off">
  <center> 
    <input class="searching" id="searching" autocomplete="off" type="text" name="k" maxlength="255">
    <input class="qlickbutton" id="qlickbutton" type="image" src="qlick button.png" alt="Qlick">
4

3 回答 3

3

将左/右边距设置为自动，并在 div 上设置宽度。

此外，如果您想知道另一个网站是如何做某事的，只需查看它们的来源和/或使用您的浏览器工具进行检查！

于 2012-10-03T17:45:42.103 回答
2

如果您想让它在所有浏览器中完美对齐，请使用百分比

HTML

​&lt;div id="main">
  <div id="searchName">your search engine name</div>
  <div id="searchEngine">SEARCH</div>
</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

CSS

#main
{
  width:50%;
  margin:30% 25%; /* for alignment (set as you need)*/
}

#main div
{    
  width:100%;
  text-align:center;
}​

或者使用定位来实现对齐。

我对你的建议是不要跟随别人的设计。在实施之前创建自己的或理解它。

于 2012-10-03T17:57:43.327 回答
0

这就是谷歌对齐的方式

center {
   text-align: -webkit-center;
}

<center>
    <div style="height:102px;"></div>
</center>

要查看完整的 html\css 源代码，请右键单击页面并使用 Chrome 检查元素。

于 2012-10-03T17:48:18.370 回答