주석 -> /*이것은 주석입니다.*/
3가지의 적용방법
-임베디드 방법 - 220720_02 파일
태그 {
} 이 방식.
-익스터널 방법
-인라인 방법
3가지의 선언방법
-태그 선택자 -- 220720_02 파일
-클래스 선택자
-아이디 선택자
기본문법
선택자{
속성 : 속성값;
속성n : 속성값n;
}
쉼표를 이용해서 다른 태그도 적용 가능!
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>두번째</title>
<style>
b {
font-size:25px; /*이것은 폰트 크기를 정의하는 속성*/
color:blue;
font-family:'궁서';
}
i,u {
color:green;
font-size:10px;
font-family:'돋움';
}
.t1{
font-size:20px;
color:blue;
font-family:'궁서';
font-weight:bold;
background:pink;
}
.t2{
font-size:20px;
color:blue;
font-family:'궁서';
}
</style>
</head>
<body>
<b>스타일 적용 텍스트</b>
<hr>
<i>스타일 적용 텍스트</i>
<hr>
<u>스타일 적용 텍스트</u>
<hr>
<div class="t1">스타일 적용 텍스트</div>
<div class="t2">스타일 적용 텍스트</div>
<span class="t1">스타일 적용 텍스트</span>
<span class="t2">스타일 적용 텍스트</span>
<hr>
<table border="1" width="350">
<tr>
<th class="t1">이름</th>
<td class="t2">홍길동</td>
</tr>
<tr>
<th class="t1">주소</th>
<td class="t2">서울시 서대문구 신촌로</td>
</tr>
<tr>
<th class="t1">전화번호</th>
<td class="t2">02-1234-4567</td>
</body>
</html>
'html css' 카테고리의 다른 글
| CSS - CSS 실습 (0) | 2022.07.20 |
|---|---|
| HTML - 실습1 (0) | 2022.07.19 |
| HTML - 입력태그 폼의 속성들 (0) | 2022.07.19 |
| HTML - 테이블 (0) | 2022.07.19 |
| HTML - html 이미지 링크 설정 (0) | 2022.07.19 |
