Yioop - PHP Search Engine

[ Prev ]

2020-09-23

-- Sep 16 In-Class Exercise Thread

<!DOCTYPE html> <html> <head> <style>

  .face{
    position: fixed;
    top: 200px;
    left: 200px;
    background-color:#fff;
    border:1px solid red;
    height:100px;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    width:100px;
  }

  .right-eye{
    position: relative;
    top: 20px;
    left: 20px;
    background-color:brown;
    border:1px solid red;
    height:10px;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    width:10px;
  }

  .left-eye{
    position: relative;
    left: 50px;
    background-color:brown;
    border:1px solid red;
    height:10px;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    width:10px;
  }

   .nose{
    position: relative;
    top: 40px;
    left: 40px;
    background-color:#fff;
    border:1px solid red;
    height:10px;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    width:5px;
  }

  .mouse{
    position: relative;
    top: 10px;
    left: 40px;
    background-color:white;
    border:1px solid blue;
    height:30px;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-top-color: transparent;
    border-left-color: transparent;
    width:50px;
  }

</style> </head> <body>

  <div class="face">
    <div class="right-eye">
    </div>
    <div class="left-eye">
    </div>
    <div class="nose">
    </div>
    <div class="mouse">
    </div">
  </div>

</body> </html>

<!DOCTYPE html> <html> <head> <style> .face{ position: fixed; top: 200px; left: 200px; background-color:#fff; border:1px solid red; height:100px; border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%; width:100px; } .right-eye{ position: relative; top: 20px; left: 20px; background-color:brown; border:1px solid red; height:10px; border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%; width:10px; } .left-eye{ position: relative; left: 50px; background-color:brown; border:1px solid red; height:10px; border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%; width:10px; } .nose{ position: relative; top: 40px; left: 40px; background-color:#fff; border:1px solid red; height:10px; border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%; width:5px; } .mouse{ position: relative; top: 10px; left: 40px; background-color:white; border:1px solid blue; height:30px; border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%; border-top-color: transparent; border-left-color: transparent; width:50px; } </style> </head> <body> <div class="face"> <div class="right-eye"> </div> <div class="left-eye"> </div> <div class="nose"> </div> <div class="mouse"> </div"> </div> </body> </html>