HTML 태그 부탁드립니다. 내공 100겁니다

HTML 태그 부탁드립니다. 내공 100겁니다

작성일 2018.01.23댓글 1건
    게시물 수정 , 삭제는 로그인 필요

전 HTML 초보입니다^^ 기본적인 몇개 말구는 아는게 별로 없는데요ㅎㅎ

HTML  태그  많이 적어주세요^^

설명도 같이 적어주심 채택률 올라갑니다ㅋ




+태그는 되도록 많이 적어주세요



#html 태그 #html 태그 종류 #html 태그 모음 #html 태그 정리 사이트 #html 태그 제거 #html 태그 그대로 출력 #html 태그 속성 #html 태그 제거 정규식 #html 태그 정리 pdf #html 태그 숨기기

profile_image 익명 작성일 -

 이글루스 Fun Doodle이란 분이 정리해둔 내역 그냥 때려씁니다.

명칭 구성 내용
html <html>...</html>  
head <head>...</head> 머리말
meta <meta... /> 정보에 대한 정보를 알려줌. 빈태그, self close
title <title>...</title> 문서 제목
body <body>...</body> 본문
p <p>...</p> Paragraph의 P : 단락, 문단, 절
h1 ~ h6 <h1>...</h1> 제목, 글자 크기, 요즘은 중요도 우선순. h1은 화사 로고에 많이 표시
hr <hr> 단락 구분. 문서의 구분선
주석태그 <!-- --> 주석
br <br /> break, 줄바꿈을 해줄때
div <div>...</div> division의 약자. HTML 문서 영역이나 섹션의 분할을 정의한다.
span <span>...</span> inline요소, 줄바꿈이 안되고, 폭 , 높이 적용도 안됨. 인라인요소들을 그룹화 하는데 사용되며, 브라우저에 레이아웃 변경은 되지 않는다.
table <table>...</table> 표, border, cellpadding, cellspacing, width, summary의 속성값이 있음. 세로정렬이 자동. 게시판에 많이 이용
  • border - 테이블의 선 두께
  • cellpadding - 셀 안쪽 여백
  • cellspacing - 셀과 셀 사이 간격
  • width - 테이블의 넓이
  • summary - 요약, 잘 사용하지 않음
caption <caption>...</caption> summary 역할. css에서 안보이게 함. 스크린리더기에 활용
colgroup <colgroup>...</colgroup> 열 그룹. 구조적인 그룹화를 위해 사용됨
col <col...> 빈태그 이지만 유일하게 self colse가 없다. 열의속성값과 스타일을 지정
thead <thead>...</thead> 테이블 헤더 행 그룹
tbody <tbody>...</tbody> 테이블 내용 행 그룹
tfoot <tfoot>...</tfoot> 테이블 푸터행 그룹. 계산시 합계 부분에 많이 이용, tbody 위에 올 수 있다. 화면상에서는 아래에 위치
th <th>...</th> 셀 제목으로 지정하여 강조되게 표시하는 태그. table header, inline요소
tr <tr>...</tr> 테이블 내의 한 행을 정의하는 태그. tabel row
td <td>...</td> 각 행에 포함된 셀을 만들때 사용되는 태그. table data, td의 개수는 th의 개수와 일치 해야한다. inline요소
  • colspan - 가로 행을 합쳐준다.
  • rowspan - 세로 열을 합쳐준다.
  • * 합쳐준 개수만큼 td 항목을 없애줘야 한다.
ol <ol>...</ol> ordered list. 순서가 있다. 앞에 넘버링이 붙는다.
ul <ul>...</ul> unordered list. 순서가 없다. 앞에 기호가 붙는다.
li <li>...</li> list. ol과 ul의 세부 항목. ol과 ul의 자식으로 li만 올 수 있다.
dl <dl>...</dl> definition list(정의 목록)
dt <dt>...</dt> 항목 definition term
dd <dd>...</dd> 설명 definition description
a <a href="" target="">daum</a> anchor. 링크 연결. inline요소 
a 태그의 속성
  • href - 목적지, url
  • target - 보여질 위치
  • * target의 속성
    • _blank - 새창
    • _self - 이동
    • _parent - 먼저 띄워진 창
    • _top - 현재 띄워진 가장 최상단에 위치한 창
  • name - a태그의 이름 지정(북마크 역할)
  • title -링크에 대한 설명
  • href - 목적지, url

  • 링크 속성 ":"는 가상 클래스
    • a:link - 방문 안한 곳, 파란색
    • a:visit - 방문 한 곳, 보라색
    • a:hover - 마우스 올렸을 때
    • a:active - 활성화 된 링크, 빨간색
img <img src="" alt="" /> 이미지 가져오기, inline요소 
이미지 속성
  • src - 경로 지정, 필수 입력
  • alt - 이미지를 위한 대체텍스트를 정의
  • title - 거의 사용하지 않음.
form <form>name="numberJoin" action="aa.html"method="post"</form> 입력을 받음. 게시판, 설문조사, 회원등록 등 폼 속성 
  • name - 전송될 데이터의 이름. value는 text. 해당 입력양식이 어느 폼에서 만들어졌는지 식별
  • action - 입력된 데이터가 전송될 페이지를 지정. value는 url. 개발자가 주로 정함.
  • method - 입력데이터가 처리될 방식. value는 get(소량) / post(대량). get이 default. 사용은 post로
fieldset <fieldset>...</fieldset> form 안에 논리적으로 묶인 구성요소를 그룹으로 묶을 때. 사각형 모양으로 표시
fieldset 요소의 제목은 legend 태그를 사용
legend <legend>...</legend> fieldset에 대한 설명. 여기서의 legend는 설명(caption), 범례의 의미와 가깝다.
label <label>...</label> 리더기가 읽어주는 부분(웹접근성)에서 중요한 요소, 다양한 폼 서식의 설명. 
for 속성 - 라벨에 표시되는 양식폼 요소의 이름을 지정.
input <input.../input> 입력 상자. 속성에 type, name, value, checked, maxlength, readonly, disabled
  • name - 필수 입력. 이름지정
  • value - 입력 구성요소의 값을 지정
  • checked - 'checked', 'radio' 일 경우 체크된 상태로 표시하게 함. checked 사용시 name값이 동일해야 함
  • maxlength - 타입 속성이 text, password 일 경우 입력 가능한 최대 문자수를 지정
  • readonly - 타입 속성이 text, password 일 경우, 요소의 값을 수정할 수 없는 읽기 전용으로 지정, 데이터 전송이 가능
  • disabled - 페이지가 로드될 때 폼 구성요소를 선택할 수 없게 한다. 수정 불가능, 데이터 전송 불가능
  • type - 입력 구성 요소의 종류를 지정
  • * type 속성 종류
    • text - 텍스트
    • password - 비밀번호창
    • email - 이메일입력
    • radio - 하나만 선택
    • checkbox - 원하는 만큼 선택
    • file - 파일첨부
    • submit - 폼의 액션페이지로 전송
    • reset - 초기화
    • button - 이벤트 발생, 자바스크립트가 붙는다
    • hidden - 개발자가 이용
textarea <textarea="say" cols="50" rows="5">하고픈 말을 적으세요 </textarea> 긴 글 작성시 사용. 여러 줄의 텍스트를 입력할 수 있는 상자를 만듦.
select / option <select name="email"> <option value="1">naver </option>
<option value="2'">daum</option>
<option value="3'">google</option> </select>
선택메뉴(드롭다운 리스트), select 요소 내의 태그에 목록에 있는 사용 가능한 옵션을 정의한다.
button <button> </button> 버튼생성, submit, reset, button. 유일하게 css값을 가지고 있는 태그, css초기화필요

덧글

홈페이지 만들기좀 도와주세요! 내공 100!

... html 파일을 ********@*****.*** 으로 보내주시거나, 태그를 답변글에 적어주시길..부탁드립니다 감사합니다, 좋은하루 되세요..^^ 안녕하세요~ 약간의 도움이 되고자 글을...

태그. html 좀 도와주세요. 내공[100]

위에 html소스 좀 알려주실수 있으세요~~ html에 완전 초보라서요.. 똑같이 안해주시도... 부탁드립니다 내공 팍팍 로그아웃 메뉴 첫페이지 시작페이지로설정...

대해서 질문합니다 (내공 100 !!)

... 답변 부탁드립니다, 내공 100 이세요!! 전 홈페이지만드는... 저렇게 선언하고 html5태그를 쓰면 안되구요 맨윗줄에 이렇게 해야 html5 문서가 되는겁니다. 네이버에...

어떤걸 공부해야할까요? 내공 100겁니다.

... 나서 html과 css를 공부했습니다. 지금은 그냥 간단하게 table을 사용해서 만들며 각각... 제가 더 공부할 수 있는 사이트 링크도 부탁드립니다. 내공추가가 100이 최고라...

불러와서 노출가능한가요?? (내공100)

html 에서 img 태그를 사용하여 svg 파일 불러와서 나타낼수있는가요? 오브젝트나 뭐... 빠른답변 정확한 답변 부탁드립니다. 이미지 테그로 불러올 수있는 이미지의...

컴퓨터로 하려고 하는데요...(내공 100)

... 그래서 내공 100겁니다.. 처음부터 끝까지 이걸 어떻게... 부탁드립니다.. 가장 빠르고 정확한 답변에 내공 드리겠습니다. 아직 컴퓨터기술로서는 철권태그의 사양을...