HTML備忘録 / 目次

  • 2003年7月18日：作成
  • 2018年10月26日：全面改訂
はじめに
（2018年の旧型環境）
html5とCSS
対象環境
通信環境　（ADSL回線、SSL接続、Webフォント）
物的環境　（SSL導入で足切、Firefox／HTTP2問題）
人的環境　（普通の大人）
基本方針
（HTML手打ち、UTF-8N）
配色　（システムカラー16色）
CSSレイアウト　（さらばTableレイアウト）
ページレイアウト　（800×600 px標準）
JavaScript解禁　（jQuery、DomStorageも解禁）
ナビゲーション　（トップページ、サイドメニュー、ナビゲーションスキップ）
記述メモ1
トップページ
  • index.shtml
ページ構造
  • <body> #page #side #main
レイアウトの基本
  • マージン
    • {margin} {margin-bottom} {margin-top} .nlf .space_*
  • 良く使うプロパティ
    • <div> {width/height} {padding} {float} {color} {background-color} {border-style} {border-width} {border-color} {border-radius} .clear
区切り線
  • <hr> #page_end
見出し
  • <h1～4> {display:table} {float:left/right}
段落
  • 基本設定
    • <p> {line-height} {text-indent} {text-align} .noindent .center .right
  • 段落中改行
    • .br
記述メモ2
文字修飾
  • 色と背景色
    • {color} {background-color} 2018.11.08：rgba（透過色）
  • サイズと太さ
    • {font-size} {font-weight}
  • ルビ
    • <ruby>
  • 上付き下付き
    • <sup> <sub> .mark
  • その他
    • <b> <u> <i> <s>
構造的修飾
  • 強調
    • <mark> <strong>
  • 規定の色
    • .white .gray .black
  • 追加
    • <ins> {text-decoration} p.ins
  • 削除
    • <del>
  • コメント
    • .comment .caution .history
整形済みテキスト
  • <pre> <code> {font-family}
アンカー／リンク
  • <a> a:link a:visited a:hover a:active
記述メモ3
表
  • <table> table.right .nowrap
リスト
  • <li> <ul> <ol> <dl> <dd> {list-style-type}
記述メモ4
縦書き
  • {writing-mode:vertical-rl} {text-orientation:upright}
画像
  • <img> <figure> <figcaption> figure.right
音声
  • <audio>（wav mp3）
動画
  • <video>（mp4 webm）
その他
顔文字
数字や英字／全角か半角か？
印刷結果
環境の見切り方
項目の目次に戻る サイトのトップに戻る