HTMLとCSS | Webプログラミング!(2021年度)

HTML

• Hypertext Markup Language
• 要素, タグ, 属性, 値
• URI,絶対URL
• ハイパーリンク
• html,head,title,body,h1,ul,ol,li,a,img
• index.html (index.html.txtではない)
• ブラウザのソースを見るなどで世の中のWebページのソースを観察できる
• Firebug, Validator Firebug add-on.ツール>Web開発>Firebug
• W3C Markup Validation Service
• "HTML Validator"

やってみよう

• ol, ul, img, a (絶対および相対指定)を含む index.html を TeraPadで作り, ブラウザで開いてみよう
• 下の例のように, headでUTF-8を指定する場合は, TeraPad でファイル>文字コード改行コードを指定して保存, でUTF-8を選びます.
• そのhtml文書と画像を WinSCP で swallow:~/public_html/local/に置いてみよう.
  • スタートメニュー>WinSCP > WinSCP
  • セッションで
    • ホスト: swallow.math.ryukoku.ac.jp
    • ポート: 22
    • Protocol: SCP
    • ユーザ名, パスワード:指定のもの
    • 秘密鍵:空欄
  • ログイン
  • 日本語ファイル名は化けてるかも
  • これがふつうのフォルダだと思って, アイコンをドラッグして転送
  • 保存しておくと後で同じ設定を使える.
• そのhtml文書と画像を Filezilla で swallow:~/public_html/local/に置いてみよう.
  • スタートメニュー>Filezilla
  • 最初だけはサイトを登録: ファイル>サイトマネージャー>新しいサイトで
    • ホスト: swallow.math.ryukoku.ac.jp
    • ポート: 空欄
    • Protocol: SFTP
    • ログオンの種類: 通常 または インタラクティブ
    • ユーザー, アカウント:指定のもの
  • 接続
  • 左右のウィンドウ間でファイルをドラッグして転送
• 参加者のページからWeb ブラウザで見てみよう. 他の人にブラウザで見てもらおう. スマートフォンや携帯で見てみよう.

サンプル

index.html