-1

Google はどのように検索エンジンを調整していますか? どの画面解像度でも、検索バーは常に中央にあり、その上にロゴがあり、その下にボタンがあるようです. 検索エンジンをまったく同じにしたいのですが、唯一の問題は、より大きな解像度では右にシフトしているように見えますが、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

これがGoogleの提携方法です

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

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

完全な html\css ソースを表示するには、ページを右クリックし、Chrome で要素を調べます。

于 2012-10-03T17:48:18.370 に答える