h1 {
color: rgb(0, 69, 134);
text-shadow: 1px 1px 2px rgb(255, 255, 255), 0 0 30px rgb(235, 253, 76), 0 0 5px rgb(218, 253, 60);
}
h3 { color: rgb(89, 0, 131); }
h2{margin-left: 39px;}
/* h2 옆에 공간을두고싶어 처음엔 html으로 직접 을 이용해서 뛰어쓰기를 하였지만 css margin을 이용해서 공간을 만드는게
더 나은것같아 구글신께 물어보고 마진으로 공간을 만들었다.*/
.asd{border-bottom: 1px solid gray;}
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic+Coding:wght@700&display=swap');
body{ font-family: 'Nanum Gothic Coding', monospace;}
/*구글 폰트에서 보여지는 폰트 이미지랑 내가만든 사이트에서 보여지는 폰트랑 뭔가 다른거같다.*/
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>모각코 3일차!_Bin</title>
<link rel="stylesheet" href="./style.css"/>
</head>
<body>
<h1>모각코 3일차!_Bin</h1>
</br>
</br>
<h2>html 오늘 배운 위키</h2>
<div class="asd"></div>
</br>
<p>
<ul>
<h3>✅<!DOCTYPE html></h3>
<li>▶ html 이 html5 버전임을 알려주는 코드이다.+ html5가 가장 최근에 진화하고,가장 많이 사용되는 버전이다.</li>
</ul>
<ul>
<h3>✅ <html> ~~~ </html></h3>
<li> ▶ 모든 html 문서는 html 태그로 감싸져 있습니다.</li>
</ul>
<ul>
<h3>✅ <head >~~~ < /head></h3>
<li>html 문서의 메타데이터를 모아놓는 부분입니다.</br></li>
<li>쉽게 말해, 웹사이트에 표시되진 않지만 웹사이트의 정보/데이터를 담아놓는 부분입니다.</li>
<li>많은 분들이 놓칠 수 있는 아주 중요한 부분이죠!</li>
<li>▶ head 안에 적는 주요한 태그로는 <meta> 태그, <title> 태그, <style> 태그, <script> 태그 등이 있습니다.</li>
</ul>
<ul>
<h3>✅ <body> ~~~ </body></h3>
<li> ▶ 1편에서 배웠던 디자인/기능을 가지고 있는 태그들(h1, h2, ul, div, p 등등)을 사실 body 안에 넣어야 합니다.</li>
</ul>
</p>
<!--
<> 를 웹페이지에 표현하고 싶었는데 태그로 인식해서 어떻게 해결할까 고민하다 구글신께 물어본 결과
<는 < >는> 로 표현 할 수 있다는걸 알게 됐다.
다른 특수문자들도 html에서는 깨지는 경우가 발생 할 수 있어서
이럴땐 특수문자의 경우 위 처럼 치환해서 사용한다고 한다.
-->
</body>
</html>
'study' 카테고리의 다른 글
6일차!_Css-Flex 속성을 이용하여 미니홈피 기본레이아웃 만들기 (0) | 2021.09.15 |
---|---|
5일차_미니홈피 기본 레이아웃 만들기 (0) | 2021.09.14 |
4일차_복습! (0) | 2021.09.14 |
모각코 스터디2일차 (0) | 2021.09.10 |
모각코 스터디 1일차 (0) | 2021.09.10 |