안녕하세요 Burg입니다.
오늘은 HTML 기초 강좌로서 기본적으로 알아야할 코드에 대해 소개하겠습니다.
HTML은 기본적으로 <HTML>으로 시작, </HTML>으로 끝난다.
<HTML>
<HEAD>
<!--- 주석, <HEAD></HEAD>내에 들어올 수 있는 코드는 <link type="text/css" rel="stylesheet" href="stylesheet.css">이다.
stylesheet.css 파일을 통해 css파일 내에서 html 꾸미기 가능. <style>이라고 생각하면됨
ex)font-size, font-family, color, background-color 등 --->
<title>html제목</title>
</HEAD>
<BODY> 출력할 것 적는곳 </BODY>
</HTML>
BODY 코드(태그)
<BODY></BODY>내에 들어갈 HTML 코드
/* body도 스타일 설정 가능 ex) <body style="background-color: white"></body>
html 전체에 해당*/
<p></p>
/*paragraph, 보통 안에 문자를 넣어서 사용한다.*/
ex) <p style="font-size: 40px">글자</p> /*'글자'문자의 폰트 크기를 40으로 설정*/
<h1></h1> ~ <h6></h6>
/*heading(헤더), 제목부분 꼭 제목만 들어간다는 것은 아니다.*/
ex) <h1 style="color: green; font-size: 10px">글자</h1> /*'글자'문자의 폰트크기 10, 글자색상 녹색으로 설정, 여러개 동시선언시 ;로 구분*/
style="text-align: left/right/center" /*text 정렬*/
<strong>글자</strong> /*text BOLD(굵게)*/
ex) <p><strong>abc</strong>de</p> /*abc만 굵게*/
<em>글자</em> /*italicize(이탤릭)글씨체, 강조*/
ex) <h1><em>ab</em>cd</h1> /*ab만 italicize체(강조)*/
<br> /*한줄 띄기*/
<hr> /*한 줄에 줄하나 긋기*/
<a href="주소"></a> /*링크 만들기, 클릭하면 href내의 주소로 이동*/
<img src="이미지 링크 주소"/> /*html에 이미지 넣기, 파일명도 가능?*/
<ol></ol> /*ordered List, 순서대로(번호대로) List*/
<ul></ul> /*unordered List 번호없이 List*/
<li></li> /*ordered list나 unordered list내에 적는 문장으로 한줄에 해당*/
<table></table> /*여러 자료 정렬해서 출력하는데 사용, 행,열 이용*/
<tr></tr> /*table내에 선언, 한 행*/
<td></td> /*table내에 선언, 한 열*/
<thead></thead> /*html의 head처럼 table내의 head*/
<th></th> /*table내의 head 줄임말로 option으로 colspan="2"처럼 줄 수 있음, 2열을 묶어 한 열로 만듬*/
<tbody></tbody> /*html의 body처럼 table내의 body*/
<div></div> /*레이아웃*/
<span></span> /*css처럼 style지정 가능*/
ex) <p><span style="color: red">hello</span></p> /*css처럼 콜론을 이용, font-size/font-family 등*/
이상 HTML 프로그래밍을 위해 기초 명령어들을 정리해봤습니다.
예문이라고 하기도 애매하게 적었는데,
필수로 필요하다고 생각하는 html 코드와 어떠한 구조인지 설명해드렸어요.
모르시거나 궁금하신것은 댓글로 남겨주세요.
오토핫키 기초 강좌 - 자주쓰는 명령어, 함수 사용법
이상으로 BURG의 유용한 정보 블로그의 유용한 정보를 봐주셔서 감사합니다.
새로고침 또는 댓글로 피드백 주시면 항상 힘이 됩니다. ^^
댓글 없음:
댓글 쓰기