[생활코딩] html

c o d i n g . . 🍉/HTML & CSS

[생활코딩] html

H J 2021. 3. 15. 08:16

우선 모든 html 태그들을 외울 필요는 전혀 없다

사용하고 싶을 때마다 검색해서 사용하면 되는 것이기 때문에!

아주 기본적인 태그들

<h1> ~ </h1> <!-- 가장 중요한 내용-->
<h2> ~ </h2>
...
<h6> ~ </h6> <!-- 가장 중요하지 않은 내용-->

<stong> 진하게 표시하고 싶은 내용 </strong>

<u> 밑줄치고 싶은 내용 </u>

<br> <!--줄바꿈을 하기 위해 필요한 태그! "닫는 태그 없음!"-->
<!-- br 태그보다 p 태그 더 많이 사용함 -> 단락별로 줄 바꿈 + 단락 사이 간격 지정 가능-->

<p> 한 단락 </p> 

<!-- CSS로 한계 극복-->
<p style="margin-top:45px;"> <!-- 단락별로 여백을 지정할 수 있다 -->

<img src="링크">

<img src ="html 파일과 같은 폴더에 저장돼있는 파일 이름" width = "100%" alt="이미지가 불러와지지 않을 때 표시할 내용">

<!-- 순서가 없는 리스트 -->
<ul>
	<li>ㅎㅅㅎ</li>
	<li>ㅇㅅㅇ</li>
	<li>ㅋㅅㅋ</li>
</ul>

<!-- 순서가 있는 리스트 -->
<ol>
	<li>ㅎㅅㅎ</li>
	<li>ㅇㅅㅇ</li>
	<li>ㅋㅅㅋ</li>
</ol>

<title> 창의 이름(?)으로 쓰이고 싶은 글 </title>

<a href="링크" target="_blank" title="마우스 갖다대면 설명이 뜸">hello web</a>

<!-- target="_blank"는 새로운 창으로 링크가 열리게 해줌 -->

더 많은 태그들이 있지만 그것은 따로 정리하고 외우지는 않을 것이다!

(좀 이따 한 번씩 적용해보면서 실습해볼 예정)

아래는 html 태그들이 사용 빈도에 따라 잘 정리되어있는 사이트이다!

이 사이트의 통계 결과를 보고 어떤 태그들을 공부하는 것이 좋을지 알 수 있다

https://www.advancedwebranking.com/html/

The average web page from top twenty Google results

Apparently, an average web page uses thirty-two different element types: The thirty-two elements used on most pages, ordered by appearance frequency:

www.advancedwebranking.com

코딩을 할 때 html의 의미에 맞게 사용하는 것이 중요하다

똑같이 보이더라도 의미에 맞는 태그를 사용하는 것이 더 좋고 접근성이 높은 글이 된다.

<!-- html의 기본 구조 -->

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">  <!--한글이 깨지지 않도록 해준다-->
		<title> 우하하 </title>
	</head>
	<body>
		<h1>hello web</h1>
	</body>
</html>

저작권 문제 없는 이미지 사이트

https://unsplash.com/

Beautiful Free Images & Pictures | Unsplash

Beautiful, free images and photos that you can download and use for any project. Better than any royalty free or stock photos.

unsplash.com

일단은 요기까지!

깃허브를 이용해서 내가 만든 사이트를 링크로 공유하는 법(웹 호스팅)을 배웠는데 이것은 <깃허브>에 따로 정리해서 올릴 것이다

그 이후로는 웹 서버에 대해 배웠는데 이것은 지금 나에게는 너무 먼 이야기 같아서 넘어갔고, 부록으로 들어가 있는 코드의 힘은 이미 짜여진 코드를 내 코드에 적용시키는 것이라서 나중에 다시 보려고 넘어갔다!

'c o d i n g . . 🍉 > HTML & CSS' 카테고리의 다른 글

[생활코딩] CSS (0)	2021.03.17
내가 정리한 HTML (0)	2021.03.15
Visual code 설치 & 파일 만들기 (0)	2021.03.15
[생활코딩] 웹 애플리케이션 만들기(5): CSS 실습 (0)	2021.02.01
[생활코딩] 웹 애플리케이션 만들기(4): CSS 이론 (0)	2021.01.31

현재글[생활코딩] html

🍃🛋🧤🍋🍧🍈🐈🎧

html 독학, 백엔드, 프론트엔드, html, css, 웹프로그래밍, python, JavaScript, 42 seoul, 자바스크립트, 코딩, 인프런, 생활코딩, 내가 정리한, 생활코딩 nodejs, Nodejs, 웹 프로그래밍, 파이썬, 웹프, 생활코딩 웹,

Today :
Yesterday :

일	월	화	수	목	금	토
		1	2	3	4	5
6	7	8	9	10	11	12
13	14	15	16	17	18	19
20	21	22	23	24	25	26
27	28	29	30	31

🐹's tory