クレアテスト1

これはクレアテスト1の見出しです

HTMLとCSSで下記の画面を作成します。


注意事項

cssの一番最初に 

    * {
        margin: 0;
        padding: 0;
    }
を記載する。



ブロック要素とインライン要素

ブロック要素は、背景色が#ccc、インライン要素は、背景色が#eee

これはブロック要素

これはインライン要素 これはインライン要素 これはインライン要素

ブロックの装飾について

widthが200px、heightが40px

箱

widthが200px、heightが40px、背景色が黄色

箱

widthが200px、heightが40px、背景色が#f90、箱同士の余白が10px

箱
箱

widthが200px、heightが40px、背景色が#ccc（インライン要素）

箱

文字について

文字色が赤

文字色が青、フォントサイズが24px

文字色が#c71585、フォントサイズが16px、太文字

文字色が#3cb371、フォントサイズが14px、フォントファミリーが「YuGothic, 游ゴシック体, Yu Gothic, 游ゴシック」


フォントサイズが12px、行間が1.5、widthが300px

とりあえずたくさん文字とりあえずたくさん文字とりあえずたくさん文字とりあえずたくさん文字とりあえずたくさん文字とりあえずたくさん文字とりあえずたくさん文字


フォントサイズが12px、背景色が#ccc、行間が100px、中央寄せ、widthが300px、heightが100px

上下左右中央寄せの文字

リストについて

リンクリスト

横並びリスト（inline-block）

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5