본문 바로가기
반응형

프로그래밍/html16

웹프로그래밍 테스트 할때 익스플로어 설정 ●웹프로그래밍 테스트 할때는 크롬보다는 익스플로어에서 먼저 하는게 좋다. ●도구->옵션->고급에서 'HTTP오류메시지표시' 체크해제하고 '모든 스크립트 오류에 관련된 알림 표시' 체크 한다. ●js, css 수정 후 바로 적용 안되면 아래 경로에서 파일보기에서 파일 삭제한다. 인터넷옵션->일반->검색지록->설정->임시 인터넷파일->파일보기 2015. 1. 6.
html 익스플로러 버전에 따라 다르게 출력<!--[if 기호 IE버전 ]> <![endif]--> ● ●초과,미만,이상,이하 > : greater than (gt) = : greater than or equals (gte) ●ie9이상에서만 표시 ●ie9초과에서만 표시 ●ie9이하에서만 표시 ●ie9미만에서만 표시 2014. 12. 1.
html 마우스 우클릭 방지, 블럭 방지 태그 ●안에 아래 태그를 입력한다. - oncontextmenu='return false' - 우클릭방지 - onselectstart='return false' - 블럭선택방지 - ondragstart='return false' - 드래그방지 ex) 2013. 10. 9.
html 버튼에 링크걸기 ●버튼에 링크를 걸려면 을 쓰면 안되고 버튼 태그 안에 onclick="location.href='#' "을 넣어줘야한다. ex) 버튼 누르면 자바스크립트 실행 2013. 9. 16.
부트스트랩2.3 틀 만들기 ●기본격자 - row안에 span을 추가한다. span*의 합은 항상 행마다 12가 되야한다.(열안의 열인 경우 감싼 열 숫자만큼 되야한다) ●열 위치이동 - offset*을 사용한다. ●열안의 열 - span* 안에 새로운 row,span*을 추가한다. 안의 열들을 함하면 감싸는 열의 숫자가 되야한다. ●유동 격자 - 열의 폭을 고정정인 값대신 비율을 사용한다. - 유동 격자 열안의 열인 경우 안의 열의 합은 항상 12가 되야한다. ●유동레이아웃 - container-fluid를 사용한다. 2013. 8. 28.
부트스트랩2.3 시작 ●부트스트랩 - css, 자바스크립트에 관한 프레임워크이다. - http://maczniak.github.io/bootstrap/index.html 에 들어가서 부트스트랩 파일을 다운받아 사용한다. - 부트스트랩은 html5 로 작성해야한다. html5는 문서 앞에 '' 를 붙인다. (html4에서는 ' 2013. 8. 28.
html 웹표준 로고 넣기 ●로고는 h1태그를 써서 그 안에 넣어준다. h1은 페이지 내에서 가장 중요한 것을 나타내는 태그이다. ex) 2012. 5. 31.
html <div>로 메뉴(내비게이션) 만들기2 ●마우스 롤 오버 태그, 속성 ●웹표준 준수 위해서 이미지의 alt속성을 꼭 넣어주고, 처럼 태그 마지막 부분을 꼭 막아줘야한다. 별 의미 없는 그냥 화면을 꾸미기 위한 이미지의 경우는 alt속성에 값을 넣지 않고 alt=""처럼 빈 속성값을 설정한다. ●이미지 링크 테두리 없애기 - 이미지에 링크를 걸면 테두리가 생긴다. 개별적으로 border값을 설정하는 것 보다 css를 이용하여 테두리를 제거한다. img {border:"0"} ●가로 메뉴 예 2012. 5. 30.
html <div>로 메뉴(내비게이션) 만들기1 ●세로 메뉴 1111 2222 3333 4444 결과 1111 2222 3333 4444 ●li안에 이미지를 세로로 나열할 때 이미지 사이에 여백이 생길경우, img속성에 'vertical-align:top;'로 설정한다. ●가로 메뉴 1111 2222 3333 4444 결과 1111 2222 3333 4444 ●li안에 'display:inline;'를 적용하면 가로로 배열이 된다. ●li안에 이미지를 가로로 나열할 때 이미지 사이에 여백이 생기는 경우, li안에 'float:left;'로 설정한다. 2012. 5. 30.
html <div>로 웹사이트 레이아웃 구성하기2 ●웹표준 레이아웃 a b c d ●#wrap{margin:0 auto; width:900px;} - table에서는 align="center"로 중앙 정렬을 했지만, 웹표준에서는 따로 중앙정렬은 없다. 그래서 중앙정렬을 하려면 가장 바깥 div에 'margin:0 auto'를 선언해 준다. 'margin:0'은 상하 0px라는 뜻이고 'auto'는 좌우를 중앙에 위치하게 한다. ●큰 div(wrap,header,sidebar,content,footer 등)를 만들고 그 안에 세부적인 div를 만든다. 큰 div는 height값을 주지 않고 세부적인 div에 height를 준다. ●width, margin, padding, height 수치를 정확히 계산해서 레이아웃을 만든다. 만들 레이아웃 디자인을 프린.. 2012. 5. 28.
DTD((Document Type Definition) 개념 ●DTD(Document Type Definition) - 웹브라우저가 웹페이지를 동일한 기준에 의해 해석 되도록 문서의 타입을 선언하는 것이다. 이클립스 사용시 파일을 생성하면 이클립스가 자동으로 dtd를 선언해준다. ●DTD는 여러가지 종류가 있다. html페이지 제일 위에 선언해야한다. 엄격모드를 사용하는 것이 정확한 웹표준을 따르는 것이지만 우리나라의 브라우저 사용실태를 고려하면 하위 버전의 브라우저에서도 호환되어야 하기 때문에 호환모드를 사용해야 한다. ex) html 4.01 Transitional(호환모드) html 4.01strict(엄격모드) 2012. 5. 25.
html <div>로 웹사이트 레이아웃 구성하기1 ●형태 #wrap{width:1000px;} #header{width:1000px; float:left;} #sidebar{width:300px; float:left;} #content{width:700px; float:left;} #footer{width:1000px; float:left;} header sidebar content footer ●html의 와 css로 레이아웃 구성하기 예 header sidebar content footer ● wrap - 레이아웃 전체를 묶어서 wrap안에 있는 div들이 깨지지 않고 자리를 잘 잡게 하기 위한 테두리이다. header - 넓이값과 float으로 위치를 잡아주면 된다. sidebar, content - sidebar와 content의 합은 레이아웃 .. 2012. 5. 22.
css 기초 정리 ● html, xml 등은 문서의 구조를 정의한다. css 는 문서의 표현을 정의한다. ●html에서 구조를 나타내기 위해 사용하는 요소들 div, span, ul, ol, dl, h1~h6, p, table 등이 있다. ●css는 html의 각 구조를 시각적 표현으로 꾸며준다. ●css의 기본 규칙 - 선택자 {속성: 값; } ex) body {background-color: gray; } ●css의 선택자 - 스타일을 적용할 대상으로, body, p, h1 등 html의 요소명이나 id명,class명을 사용할 수 있다. ●css의 속성 - 해당 선택자의 어떤 스타일을 부여할지 결정한다. ●class 선택자와 id 선택자 - 특정 요소를 대상으로 스타일을 적용하기 위해 사용한다. - id선택자는 사용할.. 2012. 5. 20.
html 그림파일 하이퍼링크 테두리 없애기 에 border="0" 추가하면 된다 2011. 11. 26.
html 문법, 태그 간단 정리2 -텍스트 -태그 Ordered List, 순서있는 목록 -태그 Unordered List, 순서없는 목록 -태그 Definition List, 용어정의 - -태그 사용자가 입력한 데이터를 웹서버에 전송 -태그 2011. 11. 24.
html 문법, 태그 간단 정리1 -html 기본형식 내용 - 태그 주로 제목,글자표시할때 사용 - 태그 break line, 강제줄바꿈 -태그 가운데 정렬 - 2011. 11. 22.
반응형