본문 바로가기

아래로 스크롤 해주세요!

My Reference Book

-

제가 배웠던것을 한곳에 정리해보았어요!

HTML

HTML 태그 톺아보기

HTML

자세히보기

CSS

CSS 속성 톺아보기

CSS

자세히보기

JAVASCRIPT

JS 실행문 톺아보기

JAVASCRIPT

자세히보기

최신댓글

HTML

기본 규칙

by C0Di 2022. 7. 26.
728x90

 

mark up 기본 규칙

마크업을 할 때 기본적으로 알고 있어야 하는 문법들

1. 요소는 시작 태그와 종료 태그가 있어야 합니다.

<p> 요소는 시작 태그와 종료 태그가 있어야 한다</>(o)
<p> 요소는 시작 태그와 종료 태그가 있어야 한다. (x)

태그 중에는 종료 태그가 없는 요소들도 있습니다. 이러한 요소를 '빈 요소(empty element)'라고 하는데, 자주 사용되는 빈 요소에는 <br>,<hr>,<img>,<input>,<meta>,<link> 등이 있습니다.

2. 요소는 제대로 중첩되어야 합니다.

<p> 중첩된 요소가 있을 때는 <strong>바르게</strong>표현해야한다.</p>(o)
<p> 중첩된 요소가 있을 때는 <strong>바르게</p>표현해야한다.</strong>(x)

마지막에 정의한 태그를 가장 먼저 닫아야 한다는 뜻인데, 이러한 중첩 관계를 부모와 자식관계라고도 합니다. 여기에서는 <p> 태그가 부모 요소가 되고, <strong> 태그가 자식 요소가 됩니다.

3. img 태그에는 alt 속성이 있어야 합니다.

<img src-"images/today.gif" alt="오늘"> (o)
<img src-"images/today.gif"> (x)

마지막에 정의한 태그를 가장 먼저 닫아야 한다는 뜻인데, 이러한 중첩 관계를 부모와 자식관계라고도 합니다. 여기에서는 <p> 태그가 부모 요소가 되고, <strong> 태그가 자식 요소가 됩니다.

4. 권장하는 사항도 있습니다.

<p>태그나 속성은 소문자로 마크업 하는 것을 권장한다.</p> (권장)
<P>태그나 속성은 소문자로 마크업 하는 것을 권장한다.</P>
<p title="속성 값">속성의 값에는 따옴표 처리를 권장한다.</P>(권장)
<p title=속성 값>속성의 값에는 따옴표 처리를 권장한다.</P>

html5는 대소문자를 구분하지는 않지만 가급적 소문자로 통일해서 마크업하는 것과, 속성에 대한 값에 따옴표 처리하는 것을 권장합니다.

5. 주석처리 방법

주석은 일반적으로 협업(공동작업)시 다음 작업자가 현재 작업한 내용을 쉽게 알아볼 수 있도록 도와주는 설명문이라고 보면 됩니다. 주석 내용은 브라우저 화면에 출력되지 않으며, 처리 방법은 다음과 같습니다.

<!-- header -->
<!-- 여기서부터 공지 사항입니다. -->

728x90
반응형

'HTML' 카테고리의 다른 글

벡터/비트맵  (5) 2022.08.09
W3C 웹 표준에 대하여 알아보자~~~!!!  (7) 2022.08.08
블록/인라인 요소가 뭘까?  (3) 2022.07.27
시멘틱 마크업에 대하여  (3) 2022.07.27
HTML : 기초  (6) 2022.07.26

댓글

#HASH_TAGS

-

1

JQuery 오늘도 웹표준은.. ImageSlideEffect scroll-snap-align Method 오징어 1Kg 당 3000원 내일은 즐거운 월요일 멈추지 않는 ' j ' 시리-즈 메서드 화사한가요? HTML 이건 또 뭐람 숙제가 다양해서 너무 좋아요 오징어 두마리 포획 완료 scroll-snap-type 공부 오늘 조업 마감했습니다. 제이쿼리 코드 선택해주세요 코딩 오징어 한마리 수확 완료! 울적하니 꽃을 달아봤습니다 슬라이드 결과 : 월요일 다크모드 오늘은 내가바로 오징어! 필터선택자