728x90
HTML
<!DOCTYPE html> # 이 문서는 HTML 언어를 사용
<html> # HTML 문서 시작
<head> # 문서 전체 정보(제목)
<meta charset="utf-8"> # 이진법 해석하는 유니코드 설정 -> 인코딩
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>안녕하세요</title>
</head>
<body> # 문서내용
<b>전성균짱</b><br>
<img src="python-logo(1).png", id="python">
<img src="python-logo(1).png", id="">
<img src="python-logo(1).png", id="">
<img src="python-logo(1).png", id="">
<table border="1"> # 표만들기
<thead> # 표제목
<tr> # 1행
<th>title1</th> # 1열
<th>title2</th> # 2열
</tr>
</thead>
<tbody> # 표내용
<tr>
<td>안녕1</td>
<td>안녕2</td>
</tr>
</tbody>
</table>
</body>
</html>
CSS
css 는 디자인.
css 를 적용하는 방법에는 3가지가 있다.
1. 적용할 태그 하나에 style 속성으로 직접 넣기
2. HTML <head> 안에 <style> 태그로 넣어서 여러 태그에 적용하기
3. CSS 파일만들어서 class 로 링크걸기
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport"
content="width=device-width,initial-scale=1">
# 2번 헤드에 css 넣기 + 3번 css 파일로 넣기
# href="css/style.css 이 부분이 css파일 위치
<link rel="stylesheet" type="text/css" href="css/style.css">
<title>안녕하세요</title>
</head>
<body>
<b>전성균짱</b><br>
<img src="python-logo(1).png", id="python">
<img src="python-logo(1).png", id="">
<img src="python-logo(1).png", id="">
<img src="python-logo(1).png", id="">
<table border="1">
<thead>
<tr>
<th>title1</th>
<th>title2</th>
</tr>
</thead>
<tbody>
<tr>
# css 파일에 만들어놓은 .highlight td 태그에만 적용하기
<td class="highlight">안녕1</td> # css
<td>안녕2</td>
</tr>
</tbody>
</table>
</body>
</html>
stly.css 파일
# 헤드 적용을 위한 css
td{
font-size: 2em;
font-family: Gulim;
text-align: center;
color: blue;
}
# class 로 원하는 태그에 넣기 위한 .highlight
# .highlight 이름은 자유롭게 가능
.highlight{
font-size: 2em;
font-family: Gulim;
text-align: center;
color: red;
}728x90
'#03.인프런 > +02.크롤링' 카테고리의 다른 글
| 크롤링 참고 링크 (0) | 2023.04.27 |
|---|---|
| [크롤링] 크롤링 기본문법 (css selector) (0) | 2023.04.26 |
| [크롤링] 크롤링 기본 문법 (find) (0) | 2023.04.26 |
