A Pen by Muhammad

Thumbnail
This awesome code was written by inelei, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright inelei ©
  • HTML
  • CSS
  • JavaScript
    <html>
  <head>
    <title>My interests</title>
  </head>
  <body>
      <h1>MY INTERESTS</h1>
    <div class="article">
      <h3>Programming</h3>
      <p>I love programming because it is so interesting when you right code and enjoy with results.</p>
      <img src="https://cdn1.iconfinder.com/data/icons/web-design-seo/512/42-512.png" class="icon" />
    </div>
    
    <div class="article">
      <h3>Music</h3>
      <p>I like listen music and also sing. My favourite singers are:
        <ul>
          <li>Nickelback</li>
          <li>Otilia</li>
          <li>Linkin Park</li>
          <li>more and more..</li>
      </ul>
      </p>
    <img src="http://findicons.com/files/icons/1580/devine_icons_part_2/512/cd_music.png" class="icon" />
    </div>
  <div class="article">
    <h3>Draw</h3>
    <p>Sometime when I don`t have any work or problems I drawing. I learn drawing for example from this resources:</p>
      <table>
        <tr>
          <th class="nam">About</th>
          <th class="nam">Link</th>
        </tr>
        <tr class="select">
          <td>Quick, Draw</td>
          <td><a href="https://quickdraw.withgoogle.com/" target="blank_">Push</a></td>
        </tr>
        <tr class="unselect">
          <td>Draw dirty</td>
          <td><a href="https://quickdraw.withgoogle.com/" target="blank_">Push</a></td>
        </tr>
        <tr class="select">
          <td>Pictures</td>
          <td><a href="https://ru.pinterest.com/explore/%D1%80%D0%B8%D1%81%D1%83%D0%BD%D0%BA%D0%B8-918644201389/">Push</a></td>
        </tr>
    </table>
    <img src="http://www.freeiconspng.com/uploads/art-brush-colors-craft-design-draw-paint-icon--icon-search--12.png" class="icon" />
  </body>
</html>

/*Downloaded from https://www.codeseek.co/inelei/a-pen-by-muhammad-YNZOKY */
    #zagolovok {
 border: 2px solid DarkCyan; 
}

h1 {
  border: 2px solid DarkCyan;
  color: DarkCyan;
  text-align: center;
  font-family: "Tahoma";
  letter-spacing: 10px;
}

.article{
  border: 1px solid DarkCyan;
  width: 40%;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  margin-top: 10px;
}

div h3 {
  text-align: center;
  color: DarkCyan;
  font-family: "Tahoma";
}

.icon {
  width: 30%;
  height: 30%;
}

.nam {
  text-align: left;
  width: 50%;
}

table {
  border: 1px solid DarkCyan;
  width: 100%;
}

a {
  color: white;
}

.select {
  background-color: DarkCyan;
  color: white;
}

.unselect {
 background-color: DarkSeaGreen;
 color: white;
}

div {
  align: center;
}


/*Downloaded from https://www.codeseek.co/inelei/a-pen-by-muhammad-YNZOKY */
    

Comments