ALbXgN

albxgn.markdown

ALbXgN

A Pen by Marshall Wilson on CodePen.

License.

index.html

<header><div align='center' width='100%'><figure><img src ="http://mediad.publicbroadcasting.net/p/wnpr/files/styles/x_large/public/201604/prince-with-hat.jpg"  /><figcaption>Prince Rogers Nelson before his untimely death on April 21, 2016.</figcaption></figure></div>
  <section></header>
<h1>Prince Rogers Nelson</h1>
<p>Prince was known by my names, such as The Purple One, His Royal Badness, Skipper, The High Priest of Pop, The Prince of Funk,
  and The Artist Formerly Known as Prince. But for most of us he was just Prince.</p>
</section>
<section><h3>A 5' 2" Giant in the music Industry</h3>
<p> <embed width="400" height="225" src="https://www.youtube.com/embed/eAN_t2BUo8U" frameborder="0" allowfullscreen ></embed>Prince was an American singer, songwriter, multi-instrumentalist, record producer, and actor. He was a musical innovator and known for his eclectic work, flamboyant stage presence, extravagant dress and makeup, and wide vocal range. His music integrates a wide variety of styles, including funk, rock, R&B, new wave, soul, psychedelia, and pop. He has sold over 100 million records worldwide, making him one of the best-selling artists of all time. He won seven Grammy Awards, a Golden Globe Award, and an Academy Award for the film <mark> Purple Rain</marK>. He was inducted into the Rock and Roll Hall of Fame in 2004, his first year of eligibility. Rolling Stone ranked Prince at number 27 on its list of 100 Greatest Artists—"the most influential artists of the rock & roll era". Check out his 2011 performance in Switzerland on the right.</p></section>
<hr class='clear'>

<section><h3>Top 30 Billboard Hits</h3>
<div class='list'>
<ul class='hits'>
  <li>"When Doves Cry"</li>
<li>"Kiss"</li>
<li>"Let's Go Crazy"</li>
<li>"Cream"</li>
<li>"Batdance"</li>
<li>"Raspberry Beret"</li>
<li>"U Got the Look"</li>
<li>"Purple Rain"</li>
<li>"The Most Beautiful Girl in the World"</li>
<li>"Sign 'O' the Times"</li>
</ul>
<ul class='hits'>
<li>"Little Red Corvette"</li>
<li>"Diamonds and Pearls"</li>
<li>"Thieves in the Temple"</li>
<li>"Pop Life"</li>
<li>"Delirious"</li>
<li>"I Would Die 4 U"</li>
<li>"7"</li>
<li>"Alphabet St."</li>
  <li>"I Could Never Take the Place of Your Man"</li>
  <li>"1999"</li>
</ul>
  <ul class='hits'>
    <li>"I Wanna Be Your Lover</li>
<li>"Partyman"</li>
<li>"Gett Off"</li>
<li>"Mountains"</li>
<li>"Take Me With You"
<li>"The Arms of Orion"</li>
 <li>"Money Don't Matter 2 Night"</li>
<li>"I Hate U"</li>
<li>"LetItGo"</li>
<li>"America"</li>
  </ul>
</div></section>
<hr class='clear'>
<section>
  <h3 class='clear'>Some Quotes From Prince</h3>
<ul>
  <li><q>You can always renegotiate a record contract. You just go in and say, 'You know, I think my next project will be a country-and-western album.</q></li>
  <li><q>People say I'm wearing heels because I'm short. I wear heels because the women like 'em.</q></li>
<li><q>Cool means being able to hang with yourself. All you have to ask yourself is "Is there anybody I'm afraid of? Is there anybody who if I walked into a room and saw, I'd get nervous?" If not, then you're cool.</q></li>
<li><q>I never really got off on awards so much. I think it's more for the people who give them and also for the fans. I get a lot of props from people in the street and a lot of love and congratulation, pats on back, so it's a good feeling you know the after-effects.</q></li>
  <li><q>I've got more hits than Madonna's got kids.</q></li>
<li><q>I don't see why I should give my new music to iTunes or anyone else. They will not give me an advance for it and they get mad when they don't get it. All computers and digital gadgets are no good. They just fill your head with numbers and they are not good for you.</q></li>
</ul></section>
<footer<p><strong> For more information on the life and achievements of Prince click <a href='https://en.wikipedia.org/wiki/Prince_%28musician%29' target="_blank">here</a>. Web design by Marshall Web Design LLC.</strong></footer>

style.css

body {
    font-size: 100%;
    font-family: "Times New Roman", Times, serif;
}

figure { 
    display: block;
    margin:auto;
  text-align:center;
}

mark {
  color:white;
  background-color:purple;
}
img {
	max-width: 700px;
	height: 400;
}
figcaption {
  color:black;
  font-size:2em;
  background-color: purple;
}

embed{
  float:right;
  margin-right:15px;
  padding-bottom: 5px;
}
body
{
  margin: 0 20px 0 20px;
}

a {
  color:purple;
  text-decoration: underline;
}

a:hover
    {
    color:black;
}


a:visited{
  color:#8B008B;
}
div {
    display: block;
    margin: auto;
     background: -webkit-repeating-radial-gradient(purple, lavender 10%); /* For Safari 5.1 to 6.0 */
    background: -o-repeating-radial-gradient(purple, lavender 10%); /* For Opera 11.6 to 12.0 */
    background: -moz-repeating-radial-gradient(purple, lavender 10%); /* For Firefox 3.6 to 15 */
    background: repeating-radial-gradient(purple, lavender 10%); /* Standard syntax (must be last) */
}

.clear{
  clear:both;
}
  hr {
    color: purple;
    height:2px;
    background-color: purple;
}
.list
{
  clear:both;
}
.hits
{
  background-color:white;
  float: left;
  margin:auto;
  padding: 0 40px 10px 20px;
}
p, li
{
  font-size:1.3em;
  color:#333;
}
h1, h3
{
  color:purple;
}

styles

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />