[Web開発]CSSの基本知識
💡CSS
•HTML親-子構造:HTMLタグが自分を囲むタグ(親タグ)を変更した場合、その内容(子タグ)も影響を受けます.
•CSSは修飾に使用されますが、ターゲットを指定する必要があります.クラスは、クラスに名前を作成し、修飾するオブジェクトを指定する署名です.(次のコードを参照)
•CSSはhead an styleスペースを作成して使用します.
例えば、mytitleというclassを飾るためにhead an style部分にあります.mytitle { ... } こう書く
•CSS:
👉背景
background-color
background-image
background-size
👉サイズ
width
height
👉フォント
font-size
font-weight
font-family
color
👉間隔
margin
padding
👉以前に作成した簡単なログインページでは、h 1ラベル部分を装飾します.
h 1タグ部分にclass=「mytitle」部分を追加し、修飾するターゲットのラベルを作成します.
あとは頭の上mytitle{...} mytitle classターゲットに修飾する方法を説明するセクションを追加します.
h 1ラベル部分の字を赤に変えました(color:red;)フォントサイズは60 pxです.(font-size:60px)<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>로그인페이지</title>
<style>
.mytitle{
color:red;
font-size:60px;
}
</style>
</head>
<body>
<h1 class="mytitle">로그인페이지</h1>
<p>ID: <input type="text"/></p>
<p>PW: <input type="text"/></p>
<button>로그인하기</button>
</body>
</html>
👉したがって、h 1タグ部分が下図のように変更されていることを確認できます.
Reference
この問題について([Web開発]CSSの基本知識), 我々は、より多くの情報をここで見つけました
https://velog.io/@cownow/웹개발-CSS-기본-지식
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>로그인페이지</title>
<style>
.mytitle{
color:red;
font-size:60px;
}
</style>
</head>
<body>
<h1 class="mytitle">로그인페이지</h1>
<p>ID: <input type="text"/></p>
<p>PW: <input type="text"/></p>
<button>로그인하기</button>
</body>
</html>
Reference
この問題について([Web開発]CSSの基本知識), 我々は、より多くの情報をここで見つけました https://velog.io/@cownow/웹개발-CSS-기본-지식テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol