HTML5 and CSS3, Second Edition

(singke) #1
<sectionid="badge">
<h3>Hi, My NameIs</h3>
<h2>Barney</h2>
</section>

<sectionid="info">
</section>
</div>

</body>
</html>

Next let’s create stylesheets/style.css and add some basic styling to define the
layout for the badge and the main content region.

css3_banner/stylesheets/style.css
#conference{
background-color:#000;
background-image:url('../images/awesomeconf.jpg');
background-position:center;
height:240px;
width:960px;
}
#badge{
border:2px solidblue;
display:block;
text-align:center;
width:200px;
}
#info{
display:block;
height:160px;
margin:20px;
padding:20px;
width:660px;
}
#badge,#info{
background-color:#fff;
float:left;
}
#badgeh2{
color:red;
margin:0;
font-size:40px;
}
#badgeh3{
background-color:blue;
color:#fff;
margin:0;
}

Chapter 8. Eye Candy • 158


Download from Wow! eBook <www.wowebook.com> report erratum • discuss

Free download pdf