CSSタグの意味

CSS … Cascading Style Sheets … 水塊の斜面滑降(cascading)

タグ 意味 使い方
margin 余白 タグ要素の外側余白の指定
padding 埋め込む タグ要素の内側余白の指定
vertical-align 垂直方向に整列させる 行のなかでの縦方向位置の指定
position:relative; 相対 相対位置を指定する
position:fixed 一定  
border-radius 半径 ボックスのコーナー角を丸くする
border-collapse:collapse; 崩壊 tableタグ内の隣接する罫線を重ねる
border-collapse:separate; 切り離す tableタグ内の隣接する罫線を離す
     
     
     

 

CSSのタグは単語が原形のまま使われてるから分かりやすい。

HTML各種タグの意味

HTML … HyperText Markup Language

 

DTD … Document Type Definition 文書型定義
<!DOCTYPE html>

 

meta … metaphor 例えば
charset  … character set characterとは文字のこと。
<meta charset="utf-8"> … HTML文字コードを指定する。

 

div … division 分割・区分 ブロックレベル要素であることを示す。
<div class="box"></div>

 

rel … relation 関係 このHTMLと外部ファイルとの関係を示す。
href … hyper reference referenceは参照。外部ファイルのURLを示す。
<link rel="stylesheet" href="../css/style.css">

 

a … anchor アンカー・錨
<a href="www.yahoo.co.jp>Yahoo Japan</a>

 

img src … image source イメージソース
<img src="../img/01.jpg" alt="">

 

h … heading 表題・見出し
<h1>大見出し</h1>

 

p … paragraph パラグラフ
<p>要約</p>

 

ul … unordered list アンオーダーリスト 番号なしのリスト。
ol … ordered list オーダーリスト 番号付きのリスト。
li … list item リストアイテム
<ul>
<li></li>
<li></li>
</ul>

 

tr … table row テーブルロウ テーブルの横一行を定義する。
th … table header cell テーブルヘッダーセル tableでセルの見出しに使う。
td … table data cell テーブルデータセル tableでセルの内容を書く。
<table>
  <tr><th>月曜日</th><td>50</td></tr>
  <tr><th>火曜日</th><td>20</td></tr>
  <tr><th>水曜日</th><td>100</td></tr>
</table>

 

dl … description list 説明リスト 定義型リストを作成する
dt … description term 説明される言葉 定義型リストの項目
dd … description, definition 説明や定義 リストの内容を記述する

<dl>
<dt></dt><dd></dd>
<dt></dt><dd></dd>
</dl>

各種練習サイト

・プログラミング・サイト制作

prog-8.com

・コード入力の練習

www.code-drill.com

・Hex colorの練習

What the Hex?

・文字デザインの練習

shape.method.ac

・px数クイズ

Whatpx - Pixel Guesstimation Game

・フォントタイプクイズ

typewar

・Webマーケティングを学ぶ

ferret-plus.com