div의 목적이 뭘까요?

모노폴리

프로필 보기 이 회원 글보기

· 12년 전 · 조회 1188 1188 · 댓글 9 9

레이아웃잡는데 있을까요?

아님 여러 메뉴들을 둘러싸서 네비, 컨텐츠, 푸터라고 이름 붙이는데 목적이 있을까요?

div와 span의 차이는 display: inline 과 block의 차이일 뿐일까요?

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 9개

지운아빠

프로필 보기 이 회원 글보기

12년 전

모노폴리님 헷갈리게 하려는데 목적이 있습니다.

모노폴리

프로필 보기 이 회원 글보기

12년 전

아 헷갈려 복수할테다.

지운아빠

프로필 보기 이 회원 글보기

12년 전

요 정도론 야갑니다.
http://sir.co.kr/bbs/board.php?bo_table=cm_junggo&wr_id=14#c_337
냑 올림

kiplayer

프로필 보기 이 회원 글보기

12년 전

처음 레이아웃이나 div span p 요 개념들을 만들었을때 만든 사람은 display 의 속성을 맘대로 바꿀려고 초기 제작하진 않았을 겁니다.
예로 h1 요 안에 div 가 들어가면 검사해서 에러로 인식합니다.

아마도 div 영역을 구분해서 하고 span 문장, 글라인에서 이용하라고 만들었을것 같은데
div 에 헤드, 푸터를 주기 시작한것은 html4 마지막에 html5 개념이 나오고 부터 본격적으로 쓰기 시작한것 같습니다. 물론 제 생각에~ ㅋㅋㅋ

승민군

프로필 보기 이 회원 글보기

12년 전

간단하게 div 는 레이아웃의 목적으로 쓰는게 맞고...
p ul h1 등은 각각의 성격에 맞춰서 사용하는것이 표준이 아닐까요 ㅡ.ㅡa

블랙스완

프로필 보기 이 회원 글보기

12년 전

html 태그 요소들을 css관점에서만 본다면 글쓴이님처럼 생각되실 수 있지만
웹 문서를 하나의 한글파일이나 워드파일, 신문기사 등과 같은 문서라고 봤을때
각 태그의 의미를 알고 있으면 이해가 쉽습니다.

- div (division) : 문서를 분할
- h1~6 (heading) : 표제, 제목
- p (paragraph) : 문단, 단락
- span : 한뼘의 짦은거리
- ul (unordered list) : 순서가 없는 목록
등등..

웹 표준이라고 단순히 css 기법이 아닌 웹 접근성 관점에서 이해를 하셔야합니다.
흔히들 웹표준을 table 코딩이 아닌 코딩법으로 이해하시는 분들이 많아서
불필요한 div를 엄청 많이 사용하는 경우를 많이 보게됩니다.

각 태그의 의미를 잘 이해하고 적재적소에 태그를 사용한다면
기존의 코딩습관보다 상당히 많은 태그를 줄이실 수 있을것입니다.

신문이나 잡지등 잘 편집된 문서 위에 태그를 적어보는 연습을 추천드립니다.

각 태그의 의미는 아래 링크에서..
https://developer.mozilla.org/en-US/docs/HTML/Element
(흐린 글짜는 웹표준에 더이상 적합하지 않은 태그입니다.)

모노폴리

프로필 보기 이 회원 글보기

12년 전

감사합니다. 많은 도움이 되었습니다.

블랙스완

프로필 보기 이 회원 글보기

12년 전

추가로 링크 하나더..
http://blog.naver.com/wdig/140049969934

lainfox

프로필 보기 이 회원 글보기

12년 전

HTML4 DTD 를 사용하고 있을때라면
레이아웃, 의미를 주는 그룹, 기능(자바스크립트를 이용한) 부분 모두를 위해 사용한다고 보입니다.

HTML5 DTD 에서 크게 section, article, div 의 의미를 찾는다면 좀 가까워 질 것 같네요.
거기에 더해서 header, footer, nav, menu 등을 통해 레이아웃, 그루핑이 나왔으니
div 는 좀 더 기능적인 부분과, division 의 개념에 집중할 수 있을 것 같습니다.

div 나 span 은 일단 기본적으로 그루핑 태그라는 것은 점이고 디폴트 속성이 inline, block 이며 안쪽의 요소도 같은 속성을 그루핑 하는 것이 가장 큰 차이라고 생각되네요.

게시글 목록

번호	제목	글쓴이	조회	날짜
5722	업체가 기준으로 유지보수 비용을 받는다면 얼마가 적당한건가요? 2	쿤이	959	12년 전
31534	반응형웹 *. 반응형 웹 관련 개발자 설문조사 결과 17	전진	9,091	12년 전
5717	제작의뢰 게시판에 대해서 4	프토코이	590	12년 전
19190	JavaScript 레이어팝업 스크립트 문의 1	제이티37	1,557	12년 전
19181	기타 vi로 URL 열기 8	프로프리랜서	1,138	12년 전
19177	JavaScript 1원짜리팁 현재 사이트 쿠키 알아내기 3	프로프리랜서	1,598	12년 전
19173	JavaScript 1원짜리팁 자바스크립트로 좌우 공백 제거구현하기 3	프로프리랜서	1,793	12년 전
19171	PHP Please help me.Fatal error: Call to undefined function dbconn_error() 1	Okta	992	12년 전
27353	퍼블리셔의 업무한계(경계?!) 설정 5	퍼블리셔지노군	1,565	12년 전
19169	MySQL Apache2, PHP, Oracle(MySQL) 웹 연동 설치 1	세븐데이	2,201	12년 전
24530	디자인이 기획에 얼마만큼의 비중을 가져오는가요? 3	신현종실장	1,328	12년 전
27350	제이쿼리를 많이 쓸수록.....부하가... 2	돼지코구뇽	1,279	12년 전
19161	PHP 몇일째 테스트 중인데 머가 문제인지 죽어도 모르겠습니다. 고수님들 도와줴요..ㅠㅠ 7	개도	1,177	12년 전
19159	기타 Zen Coding in Editplus (HTML,CSS 코딩을 빠르게) 1	senseme	7,408	12년 전
19156	웹서버 화일을 캐쉬 주고 압축해서 보내기 2	senseme	1,311	12년 전
19154	PHP 캐쉬 삭제 1	senseme	1,176	12년 전
19152	기타 모바일 웹 사용시 줌 비허용하기 1	senseme	1,953	12년 전
19150	PHP 절댓값 리턴 함수 1	senseme	950	12년 전
19147	JavaScript 자동 스크롤바 사용하기 2	senseme	1,469	12년 전
19145	JavaScript 일주기 시간대별로 플래시무비 자동 교체시키기 1	senseme	1,083	12년 전
19143	JavaScript TEXTATEA 창늘리기~ 1	senseme	1,034	12년 전
19141	PHP UTF-8 문자열 자르기 함수 1	PASKRAN	2,808	12년 전
30830	반응형 브라우저 가로사이즈에 반응하여 css로 균등한 간격으로 정렬하기~_~ 10	스아이	10,791	12년 전
19135	jQuery 상단 가운데 정렬 , 스크롤시 상단에 고정... 5	열매	2,982	12년 전
19129	jQuery 제이쿼리를 이용한 파일 업로드 관련 자료 입니다. 5	프로프리랜서	2,821	12년 전
19124	jQuery 제이쿼리 효과2입니다. 4	프로프리랜서	1,362	12년 전
19118	jQuery 제이쿼리 fadein 효과 5	프로프리랜서	2,720	12년 전
19115	PHP 간단하게 파일을 쓰거나 읽는 함수입니다 2	프로프리랜서	815	12년 전
19111	JavaScript 페이스북 댓글창, 좋아요 달기 3	프로프리랜서	1,717	12년 전
19108	PHP IP중간 * 표시 하기 2	프로프리랜서	1,132	12년 전
19104	JavaScript 글자 깜박임 blink 익스에서 구현 3	프로프리랜서	1,453	12년 전
19101	OS 화일을 캐쉬 주고 압축해서 보내기 2	프로프리랜서	1,179	12년 전
19098	PHP 혹시나 모르시는 분을 위하여... 변수명 생성하기 2	프로프리랜서	1,475	12년 전
19094	JavaScript select선택에따른추가select동적으로보여주기 3	프로프리랜서	3,592	12년 전
27342	Atomic Design (번역하기 어색해서.. ^^) 7	전진	1,860	12년 전
19093	웹서버 관리자 페이지에서 메일 발송...	난이다	905	12년 전
26548	기타 [Viewport Resizer] 모바일웹 해상도 커스터마이징툴 11	신현종실장	5,226	12년 전
19090	기타 innerHTML 오류 문의 2	제이티37	1,187	12년 전
19088	JavaScript 두 종류의 메뉴셋 사용시 메뉴선택 표시 문제 1	songsinica	1,185	12년 전
19086	PHP failed to open stream: Permission denied 오류 1	카카오툴즈	3,357	12년 전
24524	유머게시판이 우습나요? 5	cshop2	1,612	12년 전
31526	표준화 8강 아웃로그인 스킨 (skin/outlogin) 7	지운아빠	4,852	12년 전
26539	기타 웹기획자가 알아야할 개발 기획 강좌 8	스누피사랑	5,428	12년 전
32021	인증마크 품질 평가원 실명제 도입 제안했습니다. 5	지운아빠	1,833	12년 전
32015	서울 시내 병원 상대 웹 접근성 소송 관련 기사 5	지운아빠	3,045	12년 전
5705	개발자고수님들에게....[실무에 하려고 합니다] 11	희망과열정	920	12년 전
26533	견적서 견적서의뢰 .... 5	검은여우	3,279	12년 전
24510	[UI/UX] 패럴렉스 스크롤로 본 웹 화면에 대한 고찰 13	우산11	10,581	12년 전
26524	마케팅 CPA,CPS,CPC,마케팅의 정의와 활용 8	신현종실장	5,781	12년 전
24507	프로젝트 계획과 진행하기.. 2	SugarSkull	1,016	12년 전
24506	UX관련 컨퍼런스 두개	우산11	767	12년 전
19082	PHP 영카트 잘 아시는분 장바구니 문제 ㅠㅠ 3	hy미디어	1,968	12년 전
24498	[UI/UX] 사람처럼 얘기하기 7	우산11	1,550	12년 전
5702	우와~ 2	헌이	489	12년 전
27337	반응형 작업시 스타일 문제 질문 드립니다 4	후라보노보노	1,329	12년 전
32011	뽀로로 에피소드 행복한 로디 중에서 3	지운아빠	2,856	12년 전
19080	PHP 좀 글로 설명하기 난해한 질문이긴 한데요. 1	우레라	824	12년 전
19075	PHP mysqli prepare 처리방법 (mysql 보안처리) 4	친구넷	2,362	12년 전
19073	PHP explode 3번째 파라미터 1	takumi22	1,235	12년 전
19072	JavaScript 도와주세요~	개초보제이	770	12년 전
27330	우리은행 홈페이지에.. 6	고급자가되고	1,452	12년 전
27328	웹표준 코덱은 아직 미정인가요? 1	허본좌v	875	12년 전
32010	시각장애인과 함께 관람해서 더 아름다운 "아름다운 것들"	지운아빠	3,172	12년 전
32005	[펌] 2013 웹 접근성 세미나 발표 자료집 4	지운아빠	1,867	12년 전
32001	[펌] K-WAH4 4.4 업데이트 3	지운아빠	2,864	12년 전
19071	JavaScript 자바스크립트 입문자인데..이미지 변경 스크립트..좀 도와주세여	lilyosia	1,786	12년 전
19063	jQuery list sort에 좋은것 7	천율	1,051	12년 전
31998	웹 접근성 연구소에 웹 접근성 표준 개정 제안 란이 신설되었네요. 2	지운아빠	1,576	12년 전
31994	9월부터 웹 접근성 품질평가사 자격증 시험이 도입된다고 하네요. 3	지운아빠	2,723	12년 전
5676	자바스크립트 안에 php문 25	뽁스	2,549	12년 전
27327	림스키코르사코프의 왕벌의 비행 임현정 .	카이루	998	12년 전
31989	써글닷컴 웹 사이트 접근성 진단 및 컨설팅 대상 선정 4	지운아빠	2,095	12년 전
5671	소켓 통신을 이용한 재미있는 사이트 4	gilynh	1,782	12년 전
5666	결론은 PHP.... 4	에헤라디야자진방아를돌려라	772	12년 전
19056	jQuery 참 좋은 이미지 슬라이딩 라이브러리 6	너의기쁨	2,067	12년 전
31988	웹 접근성 사설 인증마크는 사라질 것 같습니다.	지운아빠	3,772	12년 전
31987	웹 표준/접근성 강좌 관련 추가 내용 안내	지운아빠	3,082	12년 전
31981	13년도 상반기 웹 접근성 순회교육 (대전/대구/광주/울산/부산/제주) 5	지운아빠	1,541	12년 전
26515	계약서 홈페이지 제작 계약서 8	위토즈	7,765	12년 전
30823	기타 파이어폭스로 작업하는 분들에게 팁! 6	세븐데이	2,527	12년 전
19050	Mobile 모바일로 접속했는지 확인하기., 5	세븐데이	2,787	12년 전
19047	정규표현식 정규표현식의 기본 팁을 .. 정리해보았습니다. 2	세븐데이	1,866	12년 전
19039	MySQL 트리거 사용법에 관하여.. 7	세븐데이	3,539	12년 전
31969	쿠키 사용범위를 확대해 보면 어떨까요. 11	묵공	1,437	12년 전
5649	<? 와 <?php 무엇이 옳바른 표현인가? 16	해피정	1,175	12년 전
27323	시맨틱 마크업 정리 초안 3	지운아빠	1,826	12년 전
31963	장차법 대상 기준을 완화하는 방법은 어떨까? 5	지운아빠	1,402	12년 전
19027	PHP php 리눅스명령어 사용법입니다 11	프로프리랜서	2,055	12년 전
19020	PHP [함수] 어떤 스마트폰에서 접속했는지 알아내는 함수 6	프로프리랜서	1,370	12년 전
19017	기타 브라우저 점유율을 국가별로 보여주는 사이트입니다. 2	프로프리랜서	1,807	12년 전
19014	PHP 파일업로드전송버튼없이파일전송하기 2	프로프리랜서	1,888	12년 전
19009	PHP 페이스 댓글, 좋아요 달기 4	프로프리랜서	1,326	12년 전
19005	JavaScript 페이스북 댓글창 좋아요 달기 3	프로프리랜서	1,551	12년 전
31949	악보를 대체텍스트로 제공한다면? 13	지운아빠	5,246	12년 전
18998	PHP 문자열 자르기 입니다. 6	프로프리랜서	1,619	12년 전
18994	PHP 정규식에 관한 내용입니다. 3	프로프리랜서	944	12년 전
18988	PHP 우분투서버 셋팅버입니다 5	프로프리랜서	1,320	12년 전
18982	PHP js, php 배열 연결 5	프로프리랜서	2,432	12년 전
31941	어려우신 분들을 위해 따로 작은 미니 홈을 준비하면 어떨까요?... (지하철 노약자석같은 개념으로) 7	xpem	1,093	12년 전
31934	웹표준에 웹접근성까지 정말 잘못 되어가고 있다는 생각이 6	돗단배123	1,409	12년 전

이전 다음

17 18 19 20 21

전체 목록