romi-brooks/hello-page

HTML&CSS Introduction Page

HelloPage

PenCode Original URL: HelloPage

---

Some Basic Options：

• Import Your Avatar :

Go to index.html

<!-- *{Import Avatar}-->
    <div class="avatarImg">
    <p>
      <img src = 'Avatar Image URL' width="600" height"200" alt="Avatar" /> 
    </p>
    </div>

---

• Import Your Background Image:

Go to style.css

body {  
  background: url('**Your Background Image location**');  
  -webkit-background-size: cover;  
  -o-background-size: cover;  
  background-size: cover;  
}  

---

• Replace Social Qoute:

Go to index.html

<!-- *{Social Qoute}-->
    <div class="aeroGlass aeroGlassSelf socialLink">
      <ul>
        <li><a href="Blog Page URL"><img src="Image URL" alt="View My Blog Page" /></a></li>
        <li><a href="Your Email"><img src="https://s1.328888.xyz/2022/04/09/X1hjO.png" alt="Send me an email" /></a></li>
        <li><a href="GitHub URL"><img src="https://s1.328888.xyz/2022/04/09/X1leA.png" alt="Follow me on GitHub" /></a></li>
        <li><a href="URL"><img src="Image URL" alt="Customized" /></a></li>
        <li>......</li>
      </ul>
    </div>

---

• Customized Music

Go to index.html

<!-- *{Favorite Song}-->
      <div>
      <p class="textNameFont textSong">My Favorite Song</p>
      <iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="Music URL"></iframe>
      </div>

To Do:

1. • Add Music Player 😍
2. • Add own introductory text 😂
3. • Add Mobile phone adaptation 🙄
4. • Rewrite Footer position 😫
5. • Fix known bugs 😢

CopyRight:

The MIT License (MIT)
Copyright (c) 2022 by Leonardo (https://codepen.io/leonardo-asher-grace/pen/wvpyNVr)