我的谷歌主页项目上的错误很少

时间:2017-07-04 08:07:17

标签: html css

"广告"和"关于"当我运行我的代码时显示紫色,而列表项的其余部分是黑色的,就像它们应该的那样。我也想摆脱搜索和感觉幸运按钮的轮廓。概述:无;或边界:无;不会工作。

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;
}

1 个答案:

答案 0 :(得分:1)

页脚中的链接是紫色的,因为您之前点击了它们。您可以使用以下CSS覆盖它:

footer li a:visited {    /* visited selector used for links which have been visited or clicked on already */
    color: black;
}

要删除边框,只需使用此CSS代码:

input[type=submit] {
    border: none;
}