A tribute page for Eddie Guerrero

In this example below you will see how to do a A tribute page for Eddie Guerrero with some HTML / CSS and Javascript

My first free code camp front end development project

Thumbnail
This awesome code was written by -J0hn-, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright -J0hn- ©

Technologies

  • HTML
  • CSS
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>A tribute page for Eddie Guerrero</title>
  <link href='https://fonts.googleapis.com/css?family=Aladin' rel='stylesheet' type='text/css'>
  
  <link rel='stylesheet prefetch' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css'>

      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>

  <body>
  <div class="jumbotron"><!-- 1-->
    <header class="main-header">
    
    </header>
    <h1 class="container" id="first-header"><span id="green">I Lie!</span> <span id="white">I Cheat!</span> <span id="red">I Steal!</span></h1>
    <br>
    <br>
    <br>
    <div class="container"><!-- 2-->
  <p id="p1" class="text-center">Eduardo Gory "Eddie" Guerrero Llanes comes from the Guerro wrestling family. Performed in many wrestling promotions in Mexico and Japan. Coming in the states, he performed in promotions such as ECW (Extreme Championship Wrestling), WCW (World Wrestling Championship) and the WWE (World Wrestling Entertainment). He was known to be the greatest proffesional wrestlers of all time by Kurt Angle, Gerald Briscoe, Triple H, CM Punk and Dusty Rhodes. His life was cut short due to dealing with alcoholism and painkillers.</p>
  <br>
      
      
      
      <div class="text-center">
  <ul>
    <li><strong>1992-1994</strong> Formed Los Gringos Locos with Art Barr, konnan, Chicano Power and Maddona's Boyfriend</li>
    <img class="img-responsive" src="http://vignette4.wikia.nocookie.net/prowrestling/images/c/c2/Los_Gringos_Locos.jpg/revision/latest?cb=20090602192746">
    <li><strong>1993-1996</strong> Began wrestling for New Japan Pro Wrestling (NJPW) where he was knwon as the incarnation of Black Tiger. Won the Best of The Super Junior's tournament</li>
    <img class="img-responsive"  src="https://s-media-cache-ak0.pinimg.com/236x/dc/d2/9c/dcd29c3755d6b1b1217e6442d9477e67.jpg">
    <li><strong>1995</strong> Won the ECW World Television Championship against 2 Cold Scorpio in his debut match.</li>
    <img class="img-responsive"  src="https://s1.dmcdn.net/Px3m0/280x157-QGU.jpg">
    <li><strong>1996-1997</strong> Defeated Jericho to win the WCW World Cruiserweight Championship</li>
    <img class="img-responsive"  src="http://i48.tinypic.com/2eycp37.jpg">
    <li><strong>1998</strong> Frustrated  with not being in the main event, he formed the Latino World Order a take off from the New World Order. However it was cut short when he got into a car accident</li>
    <img class="img-responsive"  src="http://cdn2.cagepotato.com/wp-content/uploads/2014/09/lwo.jpg">
    <li><strong>2000</strong> Made his debut in WWF alongside Chris Benoit, Dean Malenko and Perry Saturn as The Radicalz</li>
    <img class="img-responsive"  src="https://66.media.tumblr.com/2ac473e04460af3bcd599838659c9835/tumblr_mzxv0ygtTj1sg99p0o1_500.png">
    <li><strong>2002</strong> After being release from the company, he went on to wrestle on the independent circuit where he won the  IWA Mid-South Heavyweight Championship in a triple-threat match against CM Punk and Rey Mysterio</li>
    <img class="img-responsive"  src="http://cdn3.whatculture.com/images/2014/03/dfghjk.jpg">
    <li><strong>2002</strong> Returned to the WWE and defeated Rob Van Dam to become a two time Intercontinental Champion at Backlash</li>
    
    <li><strong>2003</strong> Teamed with Chavo Guerrero to defeat the team of Edge and Rey Mysterio to win their first WWE Tag Team Championship</li>
    
    <li><strong>2004</strong> Defeated Brock Lesnar at NO Way Out to win the WWE Championship </li>
    <img class="img-responsive"  src="http://img.bleacherreport.net/img/slides/photos/003/562/628/c35191f444ba0726a8295a41c30a52fa_crop_north.jpg?w=630&h=420&q=75">
</ul>
      </div>
      <br>
    </div><!-- 2-->
   
  </div><!-- 1-->
   <div class="container">
    <hr id="hr">
     <h4 id="h4" class="container">Learn more about <a href="https://en.wikipedia.org/wiki/Eddie_Guerrero" target="_blank">Eddie Guerrero</a></h4>
    </div>
     </body>
  
  

</body>

</html>

/*Downloaded from https://www.codeseek.co/-J0hn-/a-tribute-page-for-eddie-guerrero-mPLeJY */
body {
  margin: 0;
}
h1 {
  text-align: center;
}

#green {
  color: green;
  text-shadow: 2px 1px 5px grey;
}
#white {
  color:white;
  text-shadow: 2px 1px 7px black;
}
#red {
  color:red;
  text-shadow: 2px 1px 5px grey;
}
strong {
  color:green;
}

.main-header {
  height: 350px;
  background: linear-gradient(0deg, #fff, transparent), lightgrey url("https://a.fssta.com/content/dam/fsdigital/fscom/WWE/2015/11/13/111315-wwe-Eddie-Guerrero-pi-mp.vresize.1200.675.high.1.jpg") no-repeat center top/ cover fixed;
 
}
ul {
  padding: 15px;
  font-size: 19px;
  list-style-type:none;
}

li {
  padding: 10px 0 10px 0;
}
img {
/*   border-top: 5px solid green; */
  margin-left: auto;
  margin-right: auto;
}


.jumbotron {
  background-color: white;
  padding:0;
}

#first-header {
  font-size: 60px;
  color: black;
/*   text-shadow: 2px 1px 7px green; */
  font-family: 'Aladin', cursive;
}

#hr {
  padding-top: 10px;
}
#h4{
  padding-bottom: 20px;
  text-align: center;
}

Comments