HTML

メインページ>Tình báo kỹ thuật>プログラミング>HTML

Mục lục

• はじめに
• HTML nhập môn

Cơ sở

• HTML:トップレベル の công văn cấu tạo
• HEAD:メタデータ の ghi lại
• BODY:Bổn văn の ghi lại
• ハイパーリンク:リンクを tác thành する phương pháp
• リスト ( cái điều thư き ):Cái điều thư きにする phương pháp
• オブジェクト:Bức họa などを挿 nhập する phương pháp
• idとclass:Yếu tố に danh trước を phó ける phương pháp
• タグ の tỉnh lược:タグを tỉnh lược する phương pháp
• ラベル:ラベルを tác thành する phương pháp…JavaScriptと tổ み hợp わせてイベント処 lý
• Yếu tố の một lãm:よく sử われる yếu tố の giản 単な thuyết minh

Ứng dùng

• テーブル ( biểu ):Biểu を tác thành する phương pháp
• フォーム:ウェブページから tình báo を truyền tin する phương pháp
• フレーム^†:フレームはHTML5で廃 ngăn されています. フレーム の điểm chính, 廃 ngăn の lý do, thay thế kỹ thuật について giải thích.
• マイクロマークアップ:HTML yếu tố に đối して thêm vào の ý vị phó けを hành い, máy móc が công văn の nội dung をより lý giải しやすくするため の sĩ tổ み
• セマンティックHTML:HTML yếu tố に ý vị を cầm たせ, cấu tạo とコンテンツを minh xác にするため の kỹ thuật
• レスポンシブデザイン:さまざまなデバイスや hình ảnh サイズに đối ứng するため の ウェブデザイン kỹ thuật
• リキッドデザイン:Hình ảnh サイズに ứng じて mềm mại にレイアウトが変 hóa するウェブデザイン thủ pháp
• アクセシビリティ:すべて の ユーザーがウェブコンテンツを lợi dụng できるようにするため の phương pháp
• バージョン quản lý:プロジェクト の コードやリソース の 変 càng lí lịch を quản lý するシステム
• ウェブパフォーマンス:ウェブページ の đọc み込み tốc độ や ứng đáp tính を nhất thích hóa するため の kỹ thuật
• SEO ( kiểm tác エンジン nhất thích hóa ):ウェブサイトが kiểm tác エンジンで thượng vị に tỏ vẻ されるようにするため の phương pháp
• ウェブセキュリティ:ウェブアプリケーションを bảo hộ するため の phương pháp

HTMLと cộng に dùng いられる kỹ thuật

• HTML Living Standard:Mới nhất の ウェブ kỹ thuật とブラウザ cơ năng に thích ứng し続けるために thường に đổi mới されるHTML の sĩ dạng. 2024 năm 6 nguyệt hiện tại の mới nhất sĩ dạng.
• CSS:ページ の trang trí
• JavaScript:ページに động hiệu quả を cùng える
• ブラウザ:HTML の duyệt lãm hoàn cảnh
• HTML5:HTML Living Standard によって trí き đổi えられるまで の ウェブ tiêu chuẩn
• Phần ngoài リンク:HTML tác thành に dịch lập つ tình báo

はじめに

Quyển sách は,ウェブページの tiêu chuẩn なマークアップ ngôn ngữであるHTMLの giải thích thư です. テキストエディタとウェブブラウザがあれば, ウェブページを tác thành したり, tác thành したページを duyệt lãm したり, thế giới の người と tình báo を cùng sở hữu したりすることができます.

Quyển sách では, giản 単なHTML の cấu văn を thuyết minh しています. ウェブサイト の động な động tác については,JavaScriptの WikiBookをご lãm ください. また, toàn thể の thấy vinh えやスタイルを điều chỉnh するCSS( Cascading Style Sheets ) については đừng の bổn で giới thiệu していますが, quyển sách ではCSSについて giản 単に thuyết minh しています.

HTMLは thấy ra しや đoạn など の các loại yếu tố をタグと hô ばれる vật lưu niệm pháp を dùng いマークアップしたテキストファイルです. テキストファイルな の でテキストエディタ ( lệ えばWindows の メモ trướng ) で biên tập でき biên tập hoàn cảnh は tương đối vào tay dễ dàng です.

Một phương,Microsoft Edge・Google Chrome・Mozilla Firefox・OperaやSafariChờ のウェブブラウザでウェブページを tỏ vẻ するとテキストエディタで khai いたときとは vi い, レイアウト・ văn tự loại ・ sắc など nhiều く tân trang が cấu tạo に thêm えれ tỏ vẻ されます. これらはHTMLをHTMLレンダリングエンジンが giải 釈しレンダリングされた kết quả です.

ウェブ tiêu chuẩn

かつてブラウザ chiến tranh がありました. そ の ころもウェブ tiêu chuẩnはありましたが cạnh hợp thế lực と の khác biệt hóa の ため tích cực に tiêu chuẩn とは dị なる yếu tố ・ tiêu chuẩn とは dị なる giải 釈を hành うHTMLレンダリングエンジンが số nhiều thị trường に tồn tại することとなりました.

そ の kết quả, số nhiều の ブラウザで vọng み thông り の tỏ vẻ を hành うことがウェブ người chế tác にとって khó khăn なこととなり “こ の ページは XXXX の バージョン NNNN の 1024x768ピクセルで tỏ vẻ して hạ さい” の dạng に, ページ duyệt lãm giả sườn にウェブ duyệt lãm hoàn cảnh を cưỡng chế したり, vốn dĩ は biểu tổ の ため の TABLE yếu tố をつかってレイアウトするなど, HTML công văn の vốn dĩ の mục đích “Công văn の cấu tạo hóa” とは đi ngược chiều するバッドノウハウが lan tràn し, FONT yếu tố の dạng な bản chất に trang trí が mục đích で cấu tạo とは vô quan hệ な yếu tố が “ウェブ tiêu chuẩn” に hàm まれる tình thế にまでなってしまいました.

Khi は lưu れ2021 năm 6 nguyệt hiện tại, HTML quy cách の mới nhất はW3Cから tiêu chuẩn sách định を dẫn 継いだWHATWGが chuẩn hoá するHTML Living Standardとなり,Cao い tiêu chuẩn へ の chuẩn 拠 độ を thật hiện したモダンブラウザが giống nhau に sử われ, クライアント の chủ lưu もPCからスマートフォンやタブレットなど の モバイルデバイスに di りました.

Quyển sách には, HTML5や, càng に cổ いHTML4.01を đối tượng とした ghi lại がまだ nhiều く tàn っています. Nhiều く の ページはHTML Living Standardでマークアップされています ( こ の ページ tự thân も2022 năm 7 nguyệt hiện tại HTML Living Standardでマークアップされています ) の で thích hợp sai biệt について giải thích を thêm えます.

HTML nhập môn

Yếu tố とタグ

ここでは2022 năm 10 nguyệt hiện tại の hiện hành の quy cách である HTML Living Standard で の マークアップ lệ を giới thiệu します.

HTMLは, yếu tố をタグを dùng いて giai tầng な công văn cấu tạo をマークアップします.

Yếu tố

Yếu tố は,Bắt đầu タグ,Nội dung,Kết thúc タグの 3つから thành り lập ちます.

META yếu tố の ように, nội dung と kết thúc タグを bạn わないも の もあります.

またLI yếu tố の ように kết thúc タグが tỉnh lược khả năng なも の もあります.

Bắt đầu タグ

Bắt đầu タグは,<で thủy まり, yếu tố danh, thuộc tính リスト ( tỉnh lược khả năng ),>で chung わます.

Nội dung

Nội dung は, ０ cái trở lên の yếu tố ( tử yếu tố ) あるいはテキストです.

テキスト の đổi nghề は１つ の chỗ trống に trí き đổi えられ, cật め込み処 lý されます.

これが Nhật Bản ngữ の ように phân かち thư きをしない ngôn ngữ では không đều hợp が sinh じる の ですが, đổi nghề vị trí の công phu などでなるべく không khoẻ cảm がないようマークアップで lảng tránh しています.

Kết thúc タグ

Kết thúc タグは,</で thủy まり, yếu tố danh,>で chung わます.

また yếu tố danh は đại văn tự tiểu văn tự を khác nhau しませんが, HTML Living Standard の XML cấu văn では tiểu văn tự に hạn られます.

Dưới では giản 単な lệ を dùng いて giới thiệu することにしましょう.

マークアップ lệ

<!DOCTYPE html>
<htmllang="ja">
<head>
<metacharset='utf-8'>
<title>Giản 単な lệ</title>
</head>
<body>
<p>こ の công văn は phi thường に giản 単な lệ だ!</p>
</body>
</html>

1. HTML Living Standard のDOCTYPEは<!DOCTYPE html>とシンプルです. Kỹ thuật に ngôn うとDTDを bạn わない の でHTML5 lấy hàng はもはやSGMLではなくなりました.
2. HTML văn chương は tất ず1つだけ の HTML yếu tố を cầm ちます. lang thuộc tính で ngôn ngữ を chỉ định することが đẩy thưởng されます.

   <html lang= "ja" >は<で thủy まり,>で chung わる の で “Bắt đầu タグ” です. Cuối cùng hành の</html>は</で thủy まり,>で chung わる の で “Kết thúc タグ” です.<html>という bắt đầu タグと</html>という kết thúc タグで, một つ の đối をなしており, そ の gian に hiệp まれたも の は nội dung です.

3. <head>と6 hành mục の</head>も cùng じ quan hệ にあります.

   HTML yếu tố には, tất ずHEAD yếu tố とBODY yếu tố をそれぞれ1つ cầm ちます.

4. <meta charset='utf-8'>は, キャラクターコードをUTF-8に chỉ định しています. Đã định trị がUTF-8な の で cần thiết ではませんが, chỉ định しないとレンダリングが băng れる ( văn tự hóa けする ) trường hợp があります.

Tỏ vẻ phương pháp

Thượng nhớ の html の コード nội dung を thư いたファイルを.html拡 trương tử で bảo tồn し, tân しめ の webブラウザで duyệt lãm すれば, hạ nhớ の ように tỏ vẻ できるはずです.

Tỏ vẻ lệ

こ の công văn は phi thường に giản 単な lệ だ!

HTML văn chương の phi thường に giản 単でなおかつ, quan trọng な điểm をこ の lệ は kỳ しています.

• HTML văn chương の １ hành mục はドキュメントタイプ.
• HTML văn chương の ルート yếu tố はHTML yếu tố.
  • HTML yếu tố の tử yếu tố は, HEAD yếu tố とBODY yếu tố.
    • HEAD yếu tố の trung には, tất ず1つ の TITLE yếu tố.

こ の lệ văn をウェブブラウザで thấy ると thứ の ような sự が phân かります.

• TITLE yếu tố の nội dung がタブなどに tỏ vẻ される.
• BODY yếu tố の trung の văn chương が tỏ vẻ される.

HTML の Scaffolding

HTML の Scaffoldingは, ウェブサイト の cơ bản cấu tạo を giản 単に giả thiết する phương pháp です. Scaffoldingを sử dụng することで, HTML công văn の cơ bản な cấu tạo を tố sớm く giả thiết することができます.

Dưới は, HTML の Scaffoldingに tất yếu な yếu tố の lệ です.

DOCTYPE tuyên ngôn

DOCTYPE tuyên ngôn は, HTML công văn の バージョンと hình を chỉ định する tất yếu があります. Dưới は, HTML5 の DOCTYPE tuyên ngôn の lệ です.

<!DOCTYPE html>

<html> yếu tố

<html> yếu tố は, HTML công văn の ルート yếu tố であり, すべて の yếu tố を hàm む tất yếu があります.

<html>
<head>
</head>
<body>
</body>
</html>

<head> yếu tố

<head> yếu tố は, HTML công văn の メタデータを hàm む tất yếu があります. メタデータは, ページ の タイトル, キーワード, thuyết minh など の tình báo です.

<head>
<meta charset= "UTF-8" >
<title>ページ の タイトル</title>
</head>

<body> yếu tố

<body> yếu tố は, ウェブページ の thật tế の コンテンツを hàm む tất yếu があります.

<body>
<header>
</header>
<nav>
</nav>
<main>
</main>
<footer>
</footer>
</body>

これら の yếu tố を tổ み hợp わせることで, ウェブサイト の cơ bản cấu tạo を tố sớm く giả thiết することができます. ただし, Scaffoldingはあくまでも cơ bản な cấu tạo を giả thiết するため の も の であり, ページ の スタイルや cơ năng については đừng đồ giả thiết する tất yếu があります.

Phần ngoài リンク

こ の ページ “HTML”は,まだ thư きかけです. Thêm bút ・ đính chính など, hiệp lực いただける toàn dạng のBiên tậpを tâm からお đãi ちしております. また, ご ý kiến などがありましたら, お khí khinh にトークページへどうぞ.