HTML and CSS Reference
Building the Starbuzz blog page
From the previous exercise, you know that we're using a <section> element for the blog section (in
the middle column) and an <article> element for each blog post. Let's get started doing that, and
we'll come back to navigation in a bit. We've already created the “blog.html” file for you by making a
copy of the file “index.html”, and replacing the “main” <section> with a “blog” <section> . You
can get the complete “blog.html” from the code downloads for the topic; here's part of it:
We' re using a <sec tion> e lement for th e
mid dle col umn, jus t like w e did f or “ma in” in
the index. html fi le.
<h1> Starbuzz meets social media </h1>
Here at Starbuzz we're embracing the social media craze. In fact,
we're going further than any of our competitors and we're very close…
Sound like science fiction? It's not; I'm already testing our final
prototype social network cup as I write this…
So, keep your eyes out for this amazing new cup. And I'll be
releasing a video teaser soon to tell you all about this new invention,
straight from Starbuzz Coffee.
<h1> Starbuzz uses computer science </h1>
<h1> Most unique patron of the month </h1>
And with in each <article >, we use <h1> for
the head ing, and <p> for the paragraphs of
text. Pr etty simple! But more meaningfu l
than a b unch of <div>s, right?
Get the full blog post text from the “blog.html” fi le you
downloaded from wickedlysmart.com.