hello.html

<!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>title</title>
</head>
<body>
	<h1>hello world</h1>
	<!-- 주석 단축키 : ctrl + / -->
	<!-- 주석 입니다.-->
	<!-- 제목태그 -->
	<!-- alt + shft + 아래화살표 = 윗줄 복붙 -->
	<h1>제목 글자크기 1</h1>
	<h2>제목 글자크기 2</h2>
	<h3>제목 글자크기 3</h3>
	<h4>제목 글자크기 4</h4>
	<h5>제목 글자크기 5</h5>
	<h6>제목 글자크기 6</h6>
	<!-- 문장 태그 -->
	<p>한 문장입니다.</p>
	<!-- 테스트용으로 lorem을 쓴다고 함~~ -->
	<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. <br>Provident ad facere quaerat repellat possimus deleniti, delectus debitis pariatur animi dolor. Dolor soluta adipisci possimus iure laborum ipsum id earum ea!</p>
	<p>Lorem ipsum dolor sit amet.</p>
	<!-- 줄바꿈 br : 엔터, 스페이스는 안먹히므로 태그로 줄바꿈 해줘야돼-->
	<p>이 문장에는 <br>줄바꿈이 있어요</p>
	<!-- hr : 수평선을 만들어주는 태그 -->
	<hr>
	<hr size="5">
	<hr width="50%" align="center">
	<hr size="5" noshade>

	<p>단락입니다</p>
	<div style="background-color: lightcoral;">
		<h2>hello</h2>
		<p>world</p> 
	</div>
</body>
</html>

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/d6045463-2650-4a87-b62c-c5ea38df361d/Untitled.png

블록과인라인.html

<!DOCTYPE html>
<html lang="en">
<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>블록과 인라인태그</title>
</head>
<body>
     <!-- 블록태그 는 한줄을 띄워준다. 화면 전체를 차지한다. -->
    <h1 style="background-color: lightgrey;">블록 태그</h1>
    <p style="background-color: mediumaquamarine;">p도 블록 태그</p>
    <div style="background-color: mediumslateblue;">div도 블록 태그</div>
    <br><br><br>
    <hr>
    <!-- 인라인 태그 -->
    <strong>스트롱 태그</strong>
    <a href="<http://naver.com>">링크</a>
    <span style="color: olive;">span 태그</span>
    <hr>
    <p>water is H <sub>2</sub>O</p>
    <p>2 <sup>4</sup>=16 </p>
</body>
</html>

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/f84514c8-bf60-426e-80d9-1083f2b28690/Untitled.png

list.html

<!DOCTYPE html>
<html lang="en">
<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>목록-리스트</title>
</head>
<body>
    <p>순서 있는 리스트</p>
    <ol>
        <li>Coffee</li>
        <li>Tea</li>
        <li>Milk</li>
    </ol>
    <br>
    <p>순서 없는 리스트</p>
    <ul style="list-style-type: none;">
        <li>Coffee</li>
        <li>Tea</li>
        <li>Milk</li>
    </ul>
    <ul style="list-style-type: square; color: olive;">
        <li>Coffee</li>
        <li>Tea</li>
        <li>Milk</li>
    </ul>
    <ul>
        <li>Coffee</li>
        <li>Tea
            <ul>
                <li>Black tea</li>
                <li>Green tea</li>
            </ul>
        </li>
        <li>Milk</li>
    </ul>
    <br>
    <h2>리스트 예제</h2>
    <hr width="50%" align="left">
    <h3>Skills</h3>
    <ul>
        <li>사용언어
            <ul>
                <li><mark>HTML</mark></li>
                <li><mark>CSS</mark></li>
                <li>Javascript</li>
                <li>JSC</li>
            </ul>
        </li>
        <li>사용 툴
            <ul>
                <li>Eclipse</li>
                <li>HWP, EXCEL</li>
                <li><strong>Visual Studio Code</strong></li>
            </ul>
        </li>

    </ul>

</body>
</html>

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/4677bf36-96a6-4d2e-99e8-f6ba379bf5ac/Untitled.png

오늘 쓰인 태그