HTML and CSS - divs and spans: Advanced Web Construction(span elements,inline)

Head First HTML and CSS
(O'Reilly Media)
Elisabeth Robson (著), Eric Freeman (著)

開発環境

• OS X Yosemite - Apple (OS)
• Safari, Firefox + Firebug, Google Chrome(Webプラウザ、プラグイン)
• BBEdit - Bare Bones Software, Inc. (GUI) , Emacs (CUI) (Text Editor)
• HTML (マークアップ言語)
• Cascading Style Sheets(CSS) (スタイルシート)

Head First HTML and CSS(Elisabeth Robson (著)、 Eric Freeman (著)、O'Reilly Media)のChapter 10(divs and spans: Advanced Web Construction)、SHARPEN YOUR PENCIL(No. 7176)を解いてみる。

SHARPEN YOUR PENCIL(No. 7176)

HTML (BBEdit, Emacs)

<style>
  .cd {
  font-style: italic;
  }

  .artist {
  font-weight: bold;
  }
</style>
<ul>
  <li>
    <span class="cd">Buddha Bar</span>,
    <span class="artist">Claude Challe</span>
  </li>
  <li>
    <span class="cd">When It Falls</span>,
    <span class="artist">Zero 7</span>
  </li>
  <li>
    <span class="cd">Earth 7</span>,
    <span class="artist">L.T.J. Bukem</span>
  </li>
  <li>
    <span class="cd">Le Roi Est Mort, Vive Le Roi!</span>,
    <span class="artist">Eligma</span>
  </li>
  <li>
    <span class="cd">Music for Airports</span>,
    <span class="artist">Brian Eno</span>
  </li>
</ul>

• Buddha Bar, Claude Challe
• When It Falls, Zero 7
• Earth 7, L.T.J. Bukem
• Le Roi Est Mort, Vive Le Roi!, Eligma
• Music for Airports, Brian Eno