先端学校html-9/27
11872 ワード
HTMLとWebブラウザ
▲ .Webブラウザ駆動htmlファイル
▲WebブラウザはChrome、Edge、Explorer、Safari
HTML : HyperText Markup Language
Webブラウザが理解できる言語
HTML,CSS,JavaScript
「構造」HTML:Webドキュメントの基本的なスケルトン
プレゼンテーションCSS:各要素のレイアウトとモデリングを担当する->各要素の識別を強調する
アクションJavaScript:動的要素(ユーザーとのインタラクション)を担当します.
Web標準/Webアクセス性/Web互換性
[Web規格]:ブラウザの種類が多いためhtml作成ルールが定義されている->html 5
[Webアクセス可能]:様々な状況においてユーザーにバリアフリーのブラウズを提供する->スクリーンリーダー、スクリーン拡大鏡、音声認識、キーボードカバー
*良いWebサイトになるには、Webサイトのアクセス性が優れている必要があります.
[Web互換性]:Web規格に準拠したブラウザ互換性の確保
HTMLタグ記号
▲文法:<tag>내용</tag>
▲コンテンツ部分最終的にブラウザに表示される部分
▲ラベルは大文字と小文字を区別しない
▲タグにタグを含めることができる->リレーションシップを含む<h1><strong></strong></h1>
▲ラベルにレイアウトを区切ったラベル->単独で使用しても表示されない
空の要素
▲内容がない場合は、上空要素を追加する必要はありません->終了ラベル
▲<img> <br> <meta> <input> <hr>
等
コメント
▲文法:<!-- 내용 -->
▲ブラウザで説明しない
▲必要な場所だけ使用することを推奨
▲一般的なコラボレーション用
<html></html>
▲トップレベル/root要素
▲韓.htmlファイルに一度宣言するだけ
▲すべての要素はhtml要素で宣言する必要があります
<head></head>
▲機械処理用情報入力->title、script、スタイルシート
▲省略は可能ですが、省略はできません
<body></body>
▲属性を含む場所
▲ .htmlの基本構造
ブロックとインライン
▲ブロック(block):常に新しい行から始まり、親行が許容する最大横長を占める
▲インライン(inline):前の要素が終わったところから、要素の内容だけを占有する
▲<p>
タグ内に<p>
タグまたはその他のブロック要素を含めることができない
▲可能:ブロック内ブロック、ライン内線、ブロック内線
▲不可能:ライン内ブロック
ブロックタグ > <div>
> <address>, <article>, <aside>, <audio>, <blockquote>, <canvas>, <dd>, <dl>, <fieldset>, <figcaption>, <figure>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hgroup>, <hr>, <noscript>, <ol>, <output>, <p>, <pre>, <section>, <table>, <ul>, <video>
行内ラベル > <span>
> <a>, <abbr>, <acronym>, <b>, <bdo>, <big>, <br/>, <button>, <cite>, <code>, <dfn>, <em>, <i>, <img>, <input>, <kbd>, <label>, <map>, <object>, <q>, <samp>, <small>, <script>, <select>, <strong>, <sub>, <sup>, <textarea>, <tt>, <var>
Vscodeショートカットキー(window)
▲現在のウィンドウを閉じる:ctrl+w
▲サイドバー切替:ctrl+b
▲書き込み:shift+Tab
▲行の下に挿入:ctrl+Enter
▲挿入行:ctrl+shift+Enter
▲現在の行移動:Alt+ѕ/ѕ
▲現在のローのコピー:Alt+shift+ѕ/ѕ
▲現在の行の削除:ctrl+shift+k
▲コメントの切り替え:ctrl+/(マルチライン可能)
Reference
この問題について(先端学校html-9/27), 我々は、より多くの情報をここで見つけました
https://velog.io/@dasol-jeong/프론트엔드스쿨-html-927
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
Webブラウザが理解できる言語
HTML,CSS,JavaScript
「構造」HTML:Webドキュメントの基本的なスケルトン
プレゼンテーションCSS:各要素のレイアウトとモデリングを担当する->各要素の識別を強調する
アクションJavaScript:動的要素(ユーザーとのインタラクション)を担当します.
Web標準/Webアクセス性/Web互換性
[Web規格]:ブラウザの種類が多いためhtml作成ルールが定義されている->html 5
[Webアクセス可能]:様々な状況においてユーザーにバリアフリーのブラウズを提供する->スクリーンリーダー、スクリーン拡大鏡、音声認識、キーボードカバー
*良いWebサイトになるには、Webサイトのアクセス性が優れている必要があります.
[Web互換性]:Web規格に準拠したブラウザ互換性の確保
HTMLタグ記号
▲文法:<tag>내용</tag>
▲コンテンツ部分最終的にブラウザに表示される部分
▲ラベルは大文字と小文字を区別しない
▲タグにタグを含めることができる->リレーションシップを含む<h1><strong></strong></h1>
▲ラベルにレイアウトを区切ったラベル->単独で使用しても表示されない
空の要素
▲内容がない場合は、上空要素を追加する必要はありません->終了ラベル
▲<img> <br> <meta> <input> <hr>
等
コメント
▲文法:<!-- 내용 -->
▲ブラウザで説明しない
▲必要な場所だけ使用することを推奨
▲一般的なコラボレーション用
<html></html>
▲トップレベル/root要素
▲韓.htmlファイルに一度宣言するだけ
▲すべての要素はhtml要素で宣言する必要があります
<head></head>
▲機械処理用情報入力->title、script、スタイルシート
▲省略は可能ですが、省略はできません
<body></body>
▲属性を含む場所
▲ .htmlの基本構造
ブロックとインライン
▲ブロック(block):常に新しい行から始まり、親行が許容する最大横長を占める
▲インライン(inline):前の要素が終わったところから、要素の内容だけを占有する
▲<p>
タグ内に<p>
タグまたはその他のブロック要素を含めることができない
▲可能:ブロック内ブロック、ライン内線、ブロック内線
▲不可能:ライン内ブロック
ブロックタグ > <div>
> <address>, <article>, <aside>, <audio>, <blockquote>, <canvas>, <dd>, <dl>, <fieldset>, <figcaption>, <figure>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hgroup>, <hr>, <noscript>, <ol>, <output>, <p>, <pre>, <section>, <table>, <ul>, <video>
行内ラベル > <span>
> <a>, <abbr>, <acronym>, <b>, <bdo>, <big>, <br/>, <button>, <cite>, <code>, <dfn>, <em>, <i>, <img>, <input>, <kbd>, <label>, <map>, <object>, <q>, <samp>, <small>, <script>, <select>, <strong>, <sub>, <sup>, <textarea>, <tt>, <var>
Vscodeショートカットキー(window)
▲現在のウィンドウを閉じる:ctrl+w
▲サイドバー切替:ctrl+b
▲書き込み:shift+Tab
▲行の下に挿入:ctrl+Enter
▲挿入行:ctrl+shift+Enter
▲現在の行移動:Alt+ѕ/ѕ
▲現在のローのコピー:Alt+shift+ѕ/ѕ
▲現在の行の削除:ctrl+shift+k
▲コメントの切り替え:ctrl+/(マルチライン可能)
Reference
この問題について(先端学校html-9/27), 我々は、より多くの情報をここで見つけました
https://velog.io/@dasol-jeong/프론트엔드스쿨-html-927
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
[Web規格]:ブラウザの種類が多いためhtml作成ルールが定義されている->html 5
[Webアクセス可能]:様々な状況においてユーザーにバリアフリーのブラウズを提供する->スクリーンリーダー、スクリーン拡大鏡、音声認識、キーボードカバー
*良いWebサイトになるには、Webサイトのアクセス性が優れている必要があります.
[Web互換性]:Web規格に準拠したブラウザ互換性の確保
HTMLタグ記号
▲文法:<tag>내용</tag>
▲コンテンツ部分最終的にブラウザに表示される部分
▲ラベルは大文字と小文字を区別しない
▲タグにタグを含めることができる->リレーションシップを含む<h1><strong></strong></h1>
▲ラベルにレイアウトを区切ったラベル->単独で使用しても表示されない
空の要素
▲内容がない場合は、上空要素を追加する必要はありません->終了ラベル
▲<img> <br> <meta> <input> <hr>
等
コメント
▲文法:<!-- 내용 -->
▲ブラウザで説明しない
▲必要な場所だけ使用することを推奨
▲一般的なコラボレーション用
<html></html>
▲トップレベル/root要素
▲韓.htmlファイルに一度宣言するだけ
▲すべての要素はhtml要素で宣言する必要があります
<head></head>
▲機械処理用情報入力->title、script、スタイルシート
▲省略は可能ですが、省略はできません
<body></body>
▲属性を含む場所
▲ .htmlの基本構造
ブロックとインライン
▲ブロック(block):常に新しい行から始まり、親行が許容する最大横長を占める
▲インライン(inline):前の要素が終わったところから、要素の内容だけを占有する
▲<p>
タグ内に<p>
タグまたはその他のブロック要素を含めることができない
▲可能:ブロック内ブロック、ライン内線、ブロック内線
▲不可能:ライン内ブロック
ブロックタグ > <div>
> <address>, <article>, <aside>, <audio>, <blockquote>, <canvas>, <dd>, <dl>, <fieldset>, <figcaption>, <figure>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hgroup>, <hr>, <noscript>, <ol>, <output>, <p>, <pre>, <section>, <table>, <ul>, <video>
行内ラベル > <span>
> <a>, <abbr>, <acronym>, <b>, <bdo>, <big>, <br/>, <button>, <cite>, <code>, <dfn>, <em>, <i>, <img>, <input>, <kbd>, <label>, <map>, <object>, <q>, <samp>, <small>, <script>, <select>, <strong>, <sub>, <sup>, <textarea>, <tt>, <var>
Vscodeショートカットキー(window)
▲現在のウィンドウを閉じる:ctrl+w
▲サイドバー切替:ctrl+b
▲書き込み:shift+Tab
▲行の下に挿入:ctrl+Enter
▲挿入行:ctrl+shift+Enter
▲現在の行移動:Alt+ѕ/ѕ
▲現在のローのコピー:Alt+shift+ѕ/ѕ
▲現在の行の削除:ctrl+shift+k
▲コメントの切り替え:ctrl+/(マルチライン可能)
Reference
この問題について(先端学校html-9/27), 我々は、より多くの情報をここで見つけました
https://velog.io/@dasol-jeong/프론트엔드스쿨-html-927
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
▲内容がない場合は、上空要素を追加する必要はありません->終了ラベル
▲
<img> <br> <meta> <input> <hr>
等コメント
▲文法:<!-- 내용 -->
▲ブラウザで説明しない
▲必要な場所だけ使用することを推奨
▲一般的なコラボレーション用
<html></html>
▲トップレベル/root要素
▲韓.htmlファイルに一度宣言するだけ
▲すべての要素はhtml要素で宣言する必要があります
<head></head>
▲機械処理用情報入力->title、script、スタイルシート
▲省略は可能ですが、省略はできません
<body></body>
▲属性を含む場所
▲ .htmlの基本構造
ブロックとインライン
▲ブロック(block):常に新しい行から始まり、親行が許容する最大横長を占める
▲インライン(inline):前の要素が終わったところから、要素の内容だけを占有する
▲<p>
タグ内に<p>
タグまたはその他のブロック要素を含めることができない
▲可能:ブロック内ブロック、ライン内線、ブロック内線
▲不可能:ライン内ブロック
ブロックタグ > <div>
> <address>, <article>, <aside>, <audio>, <blockquote>, <canvas>, <dd>, <dl>, <fieldset>, <figcaption>, <figure>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hgroup>, <hr>, <noscript>, <ol>, <output>, <p>, <pre>, <section>, <table>, <ul>, <video>
行内ラベル > <span>
> <a>, <abbr>, <acronym>, <b>, <bdo>, <big>, <br/>, <button>, <cite>, <code>, <dfn>, <em>, <i>, <img>, <input>, <kbd>, <label>, <map>, <object>, <q>, <samp>, <small>, <script>, <select>, <strong>, <sub>, <sup>, <textarea>, <tt>, <var>
Vscodeショートカットキー(window)
▲現在のウィンドウを閉じる:ctrl+w
▲サイドバー切替:ctrl+b
▲書き込み:shift+Tab
▲行の下に挿入:ctrl+Enter
▲挿入行:ctrl+shift+Enter
▲現在の行移動:Alt+ѕ/ѕ
▲現在のローのコピー:Alt+shift+ѕ/ѕ
▲現在の行の削除:ctrl+shift+k
▲コメントの切り替え:ctrl+/(マルチライン可能)
Reference
この問題について(先端学校html-9/27), 我々は、より多くの情報をここで見つけました
https://velog.io/@dasol-jeong/프론트엔드스쿨-html-927
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
▲トップレベル/root要素
▲韓.htmlファイルに一度宣言するだけ
▲すべての要素はhtml要素で宣言する必要があります
<head></head>
▲機械処理用情報入力->title、script、スタイルシート
▲省略は可能ですが、省略はできません
<body></body>
▲属性を含む場所
▲ .htmlの基本構造
ブロックとインライン
▲ブロック(block):常に新しい行から始まり、親行が許容する最大横長を占める
▲インライン(inline):前の要素が終わったところから、要素の内容だけを占有する
▲<p>
タグ内に<p>
タグまたはその他のブロック要素を含めることができない
▲可能:ブロック内ブロック、ライン内線、ブロック内線
▲不可能:ライン内ブロック
ブロックタグ > <div>
> <address>, <article>, <aside>, <audio>, <blockquote>, <canvas>, <dd>, <dl>, <fieldset>, <figcaption>, <figure>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hgroup>, <hr>, <noscript>, <ol>, <output>, <p>, <pre>, <section>, <table>, <ul>, <video>
行内ラベル > <span>
> <a>, <abbr>, <acronym>, <b>, <bdo>, <big>, <br/>, <button>, <cite>, <code>, <dfn>, <em>, <i>, <img>, <input>, <kbd>, <label>, <map>, <object>, <q>, <samp>, <small>, <script>, <select>, <strong>, <sub>, <sup>, <textarea>, <tt>, <var>
Vscodeショートカットキー(window)
▲現在のウィンドウを閉じる:ctrl+w
▲サイドバー切替:ctrl+b
▲書き込み:shift+Tab
▲行の下に挿入:ctrl+Enter
▲挿入行:ctrl+shift+Enter
▲現在の行移動:Alt+ѕ/ѕ
▲現在のローのコピー:Alt+shift+ѕ/ѕ
▲現在の行の削除:ctrl+shift+k
▲コメントの切り替え:ctrl+/(マルチライン可能)
Reference
この問題について(先端学校html-9/27), 我々は、より多くの情報をここで見つけました
https://velog.io/@dasol-jeong/프론트엔드스쿨-html-927
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
▲属性を含む場所
▲ .htmlの基本構造
ブロックとインライン
▲ブロック(block):常に新しい行から始まり、親行が許容する最大横長を占める
▲インライン(inline):前の要素が終わったところから、要素の内容だけを占有する
▲<p>
タグ内に<p>
タグまたはその他のブロック要素を含めることができない
▲可能:ブロック内ブロック、ライン内線、ブロック内線
▲不可能:ライン内ブロック
ブロックタグ > <div>
> <address>, <article>, <aside>, <audio>, <blockquote>, <canvas>, <dd>, <dl>, <fieldset>, <figcaption>, <figure>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hgroup>, <hr>, <noscript>, <ol>, <output>, <p>, <pre>, <section>, <table>, <ul>, <video>
行内ラベル > <span>
> <a>, <abbr>, <acronym>, <b>, <bdo>, <big>, <br/>, <button>, <cite>, <code>, <dfn>, <em>, <i>, <img>, <input>, <kbd>, <label>, <map>, <object>, <q>, <samp>, <small>, <script>, <select>, <strong>, <sub>, <sup>, <textarea>, <tt>, <var>
Vscodeショートカットキー(window)
▲現在のウィンドウを閉じる:ctrl+w
▲サイドバー切替:ctrl+b
▲書き込み:shift+Tab
▲行の下に挿入:ctrl+Enter
▲挿入行:ctrl+shift+Enter
▲現在の行移動:Alt+ѕ/ѕ
▲現在のローのコピー:Alt+shift+ѕ/ѕ
▲現在の行の削除:ctrl+shift+k
▲コメントの切り替え:ctrl+/(マルチライン可能)
Reference
この問題について(先端学校html-9/27), 我々は、より多くの情報をここで見つけました
https://velog.io/@dasol-jeong/프론트엔드스쿨-html-927
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
> <div>
> <address>, <article>, <aside>, <audio>, <blockquote>, <canvas>, <dd>, <dl>, <fieldset>, <figcaption>, <figure>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hgroup>, <hr>, <noscript>, <ol>, <output>, <p>, <pre>, <section>, <table>, <ul>, <video>
行内ラベル > <span>
> <a>, <abbr>, <acronym>, <b>, <bdo>, <big>, <br/>, <button>, <cite>, <code>, <dfn>, <em>, <i>, <img>, <input>, <kbd>, <label>, <map>, <object>, <q>, <samp>, <small>, <script>, <select>, <strong>, <sub>, <sup>, <textarea>, <tt>, <var>
Vscodeショートカットキー(window)
▲現在のウィンドウを閉じる:ctrl+w
▲サイドバー切替:ctrl+b
▲書き込み:shift+Tab
▲行の下に挿入:ctrl+Enter
▲挿入行:ctrl+shift+Enter
▲現在の行移動:Alt+ѕ/ѕ
▲現在のローのコピー:Alt+shift+ѕ/ѕ
▲現在の行の削除:ctrl+shift+k
▲コメントの切り替え:ctrl+/(マルチライン可能)
Reference
この問題について(先端学校html-9/27), 我々は、より多くの情報をここで見つけました
https://velog.io/@dasol-jeong/프론트엔드스쿨-html-927
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
> <span>
> <a>, <abbr>, <acronym>, <b>, <bdo>, <big>, <br/>, <button>, <cite>, <code>, <dfn>, <em>, <i>, <img>, <input>, <kbd>, <label>, <map>, <object>, <q>, <samp>, <small>, <script>, <select>, <strong>, <sub>, <sup>, <textarea>, <tt>, <var>
▲現在のウィンドウを閉じる:ctrl+w
▲サイドバー切替:ctrl+b
▲書き込み:shift+Tab
▲行の下に挿入:ctrl+Enter
▲挿入行:ctrl+shift+Enter
▲現在の行移動:Alt+ѕ/ѕ
▲現在のローのコピー:Alt+shift+ѕ/ѕ
▲現在の行の削除:ctrl+shift+k
▲コメントの切り替え:ctrl+/(マルチライン可能)
Reference
この問題について(先端学校html-9/27), 我々は、より多くの情報をここで見つけました https://velog.io/@dasol-jeong/프론트엔드스쿨-html-927テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol