0
"広告"と "情報"はコードを実行すると紫色に表示され、その他のリスト項目は黒く表示されます。私はまた、検索と幸運なボタンを感じるの概要を取り除きたいと思います。概要：なし。または境界：なし;動作しません。あなたが前にそれらをクリックしたので私のGoogleホームページプロジェクトにはほとんどバグがありません
HTML
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
type="text/css"
href="style.css">
</head>
<body>
<title>Google</title>
<div class="options">
<ul>
<li> <a href="button">Gmail</li>
<li> <a href="button">Images</li>
<li> <a href="button"><img src="http://www.myiconfinder.com/uploads/iconsets/256-256-f6227d477e683ae5bd1270aac11b93e5-grid.png"width="25px" height="25px"></li>
<li> <a href="button"><img src="https://d30y9cdsu7xlg0.cloudfront.net/png/338473-200.png"width="25" height="25"></li>
<li> <a href="button"><img src=https://lh3.googleusercontent.com/-gsXjacdjY8E/AAAAAAAAAAI/AAAAAAAAAAA/AI6yGXxkQbqvng1PHA5RhhTLQowbW3ykkQ/s32-c-mo/photo.jpg></li>
</ul>
</div>
<h1><img src=https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png></h1>
<div class="fake-input">
<input type="text"/>
</div>
<div class="buttons">
<ul>
<li><input type="submit"input value="Google Search"></li>
<li><input type="submit"input value="I'm feeling lucky!"></li>
</ul>
</div>
<footer>
<div class="footer">
<ul style="float:left;list-style-type:none;">
<li><a href="https://www.google.com/intl/en/ads/?fg=1">Advertising</li>
<li><a href="https://www.google.com/services/?fg=1">Business</li>
<li><a href="https://www.google.com/intl/en/about/">About</li>
</ul>
<ul style="float:right;list-style-type:none;">
<li><a href="https://www.google.com/intl/en/policies/privacy/?fg=1">Privacy</li>
<li><a href="https://www.google.com/intl/en/policies/terms/?fg=1">Terms</li>
<li><a href="https://www.google.com/preferences?hl=en">Settings</li>
</ul>
</div>
</footer>
</body>
</html>
CSS
.options ul{
text-align: right;
list-style-type: none;
margin: 0;
padding: 0;
}
.options li{
font-size:14px;
padding: 5px;
display: inline;
}
a:link{
text-decoration:none;
color:black;
}
img{
border-radius:15px;
font-family: arial,sans-serif;
}
h1{
text-align:center;
margin-top:160px;
}
h2{
text-align:center;
}
input[type='text'] {
margin-left:375px;
width:500px;
height:50px;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAACrElEQVR42u2Xz2sTQRSAX8VSb1K8iNqKooJH2Ux6Ksn+iPQqxZMIehJB0do/IMhmQWsvHr2KSEGk0tSLIoWIYNUKij20F2/N7iaUZnYT0kYzzhMKs0HDJiTdLcwHDwKZSd63781LBiQSSW9JZdkhzfKm1Rz9mjZp/W9YdEU3vXv4HsQZ40FtNG36q5rls//Ej4tmbSS2T15Mvp3ExOPmEMQNbBtMMEyoljcFcQN7PqyAlqNfIG7gYQ0tYNIaxA1MrJPY3wImbUqBKAXSFv0tBSIVMOkvKRDtGKWN/T6FdqRAxFNoWwpEPIXqUqBT6ALU/UVgu8GW4GD3f6f9TRDYNJTDrk7YbtiqUumHwIYoUJuHERDAS0r4CvgFECgbY+cFAR7KT+g1POmCKFDNw6WggHc3fBtVb4CAoyauBgXIG+g1Xh5mRAGah6cggBd11fK/h7lOprIs0H6uRl6KAo5O7kOv4QmPiwJ4Jqqv4FiwCtXjvD2+tRmfK6kZ/ygI2HritK0rDVGgrClJ6DWMwYC/AGuCBMYcIC2V0CzvjmbRz3j3xUjn6CfeYreUJ2wQkGD75INPX1mFfsEFrrcIYCvdhC4paWQakxajpJMr0C9YFg54i7AsClRmh9/xnr0NHcInzZStk2aLwAcGMAD9pPIazvFKVDD5rdnhJeHLX5RTyRPQHpz5o66emMc9wdlPtvA8wF7Aq2BUHh1525qEo5JtR1WeOXpickO9cJIpyuD6xJmhYiZ5ytWSl3mlnuOaf+2zDaLDXmJrSgZ/MYVEugo+gSh+FkSBa4yd5Ul87DZ5XpFl/AyIEjzYjkau8WqshU2cr13HPbgX4gJOD97n465GZlyVvC9mSKloKI2iTnbwNT+gBX54H+IaXAtxJzE3ycSAFqSAFJACUkAikXD+AHj5/wx2o5osAAAAAElFTkSuQmCC);
background-position: 450px 7px;
background-repeat: no-repeat;
}
.buttons ul{
text-align:center;
list-style-type:none;
margin:0;
padding:0;
}
.buttons li{
background-color: #f2f2f2;
padding: 5px;
display: inline-block;
border:none;
}
input:focus {
outline-style: none;
}
.footer {
background: #f2f2f2;
position: fixed;
bottom: 0px;
width:95%;
}
.footer li{
display:inline;
text-decoration: none;
font-family: arial,sans-serif;
font-size: small;
color: #666;
}
あなたはあなたのCSSを上書きされている場所を確認するためのdevのツールを使用することはできますか？ – sol
これを行う方法がわからない、私は何か間違っていると思った。私は開発者ツールをどのように持ち出すかを知っていますが、私はまだそれらのハングを取得しています。 –
これは愚かなコメントかもしれません。以前に訪れたので紫色ですか？ – Cristophs0n