[Front-End] HTML & CSS
INTRO
1.言語
2.Webブラウザ
1) W3C
https://www.w3.org/
:Webブラウザ、ページ推奨
->W 3 C validatorを使用してWeb規格に適合しているかどうかを確認できます
2)ネットワークアクセス性研究所
https://www.wah.or.kr:444/Participation/guide.asp
:開発者のWebコンテンツアクセスガイドライン
3. VS CODE
私は生活のコードの授业の上で书いたことがあって、初めて韩国语のパッチをダウンロードする方法を知っていて、ほほほ、早めに理解するべきです...
1)拡張プログラム
ex)韓国語パッチ、beautify、live server(彼はすでにやっています)
2)ショートカットキー
ファイル>プリファレンス>ホットキー(File>Preferences>Hotkey)
4.イメージ
>>ビットマップvsベクトル
1)ビットマップ
:画面レンダリング形式で出力される密ピクセルイメージ
ex) jpg, png, gif
2)ベクトル
:点、線、面の位置によってスクリーン上でレンダリングされ、画像は破壊されませんが、大量の演算が必要です.
ex) svg
HTML
1.構文
1)ラベル:tag
:矢印カッコ「<>」で実行する内容を含むHTMLのコア構文
https://www.advancedwebranking.com/html/ <TAG> 내용 </TAG>
: 열리고 닫히는 구조
2)属性:attribute
:ラベルの情報だけでは不十分であり、情報不足を補うために使用できる<TAG 속성="값"> 내용 </TAG>
3)親子構造
:親ラベルに別のラベルが含まれる構造(親ラベル-子ラベル)<PARENT>
<CHILD></CHILD>
</PARENT>
4)ドキュメントのフォーマットを指定する
:DOCTYPEドキュメントフォーマットの指定
2.主要ラベル-HEAD
1) TITLE
:Webページのタイトルを表すラベル(タブの名前)<head>
<title> 벨로그 </title>
</head>
2) META
:その他の情報を表すタグ
>>主な属性
: charset, name, content<head>
<meta charset="UTF-8">
</head>
3) LINK
:外部文書のリンク(CSS文書)
>>主な属性
: rel, href<head>
<link rel="stylesheet" href="./css/main.css">
</head>
4) STYLE
:CSSを使用せずにHTMLを直接使用
5) SCRIPT
:CSSをHTMLに合成する場合は、SCRIPTタグ内で作成するだけです
3.主要ラベル-BODY
1) DIV
:意味のないラベル、何かを包んだり縛ったりするためのラベル
2) IMAGE
:画像のタグを挿入
>>主な属性
: src, alt
CSS
1.スタイルラベル
クリーンアップ用語
<TAG> 내용 </TAG>
: 열리고 닫히는 구조
<TAG 속성="값"> 내용 </TAG>
<PARENT>
<CHILD></CHILD>
</PARENT>
<head>
<title> 벨로그 </title>
</head>
<head>
<meta charset="UTF-8">
</head>
<head>
<link rel="stylesheet" href="./css/main.css">
</head>
1.スタイルラベル
クリーンアップ用語
2.属性タイプ
1)サイズ
>>横と縦
->単位:px
>>フォント
div{
width: 300px; height: 600px;
// 요소의 가로너비: 너비값;
font-size: 16px;
}
2)マージン
div{
margin-top: 20px;
margin-right: 10px;
margin-botton: 15px;
margin-left: 20px;
padding: 7px;
}
3)色
div {
color: blue;
background-color: red;
}
Reference
この問題について([Front-End] HTML & CSS), 我々は、より多くの情報をここで見つけました https://velog.io/@z00m__in/Front-End-HTML-CSSテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol