我如何能像Google一樣對齊我的搜索引擎？

-1

Google如何調整其搜索引擎？看起來，任何屏幕分辨率，搜索欄始終居中，上方有徽標，下方有按鈕。我希望我的搜索引擎完全一樣，唯一的問題是它似乎在更大的分辨率上正確轉移，但在我的Macbook Pro上很好？我如何能像Google一樣對齊我的搜索引擎？

任何想法？我的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">

來源

2012-10-03 Fenrir Greyback

您可以在google.com上查看CSS，看看他們是如何做到的。 – Kamil

設置你的左/右頁邊距爲自動，並設置你的DIV的寬度。另外，如果您想知道其他網站如何做某些事情，只需查看其來源和/或使用瀏覽器工具進行檢查即可！

來源

2012-10-03 17:45:42 Brad

哪個div？和谷歌的是非常複雜的 –

您想要居中的div ... – Brad

試試Opera。它具有稱爲蝴蝶的最佳檢測工具。 – Kamil

這是谷歌如何對齊

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

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

要查看完整的HTML \ CSS源右鍵單擊頁面上，並檢查使用Chrome的元素。

來源

2012-10-03 17:48:18

，如果你想讓它完全在所有瀏覽器對齊，然後用百分比去像

HTML

<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-03 17:57:43

我如何能像Google一樣對齊我的搜索引擎？

回答

相關問題