목록분류 전체보기 (27)
름름
1. padding - 부모박스의 높이가 제한적이지 않을경우. #box {width:500px; border:3px solid #ccc;}.al {padding:30px; text-align: center;} vertical-align: middle 2. line-height - 부모요소의 높이가 제한되어 있고, 한줄일경우 #box {width:500px; height:60px;line-height: 60px;border:3px solid #ccc; text-align: center; } vertical-align: middle - 부모요소의 높이가 제한되어 있고, 여러줄일 경우 #box {width:500px; height:60px;line-height: 60px; border:3px solid #cc..
html css img {vertical-align: top;} /*4px gab을 위한 처리*/ .innerborder {float: left; overflow: hidden;}.innerborder:hover img {margin:-5px;}.innerborder:hover {border:5px solid blue;} 1. img요소만큼 공간값을 가지기위해 float 지정.2. img에 margin을 -5px을 줌으로써 img를 감싼 a요소의 크기가 상하좌우 -5px씩 줄어듬3. a요소에 overflow:hidden을 주어 img 넘치는 부분을 가림.4. 줄어든 5px만큼 border값을 지정 내부요소에 마진값을 주면 감싼 요소는 그 마진값을 포함하여 넓이를 갖게된다.당근 음수마진값을 주면 외부요소는..
이미지 4px정도 여백은 영어에 아랫첨자가 있기 때문입니다. (EX: 영소문자 g 또는 j 등등)이와 같은 문제는 FF(파이어폭스)에서도 마찬가지이며 해결 방안으로는태그에 style img {vertical-align: top;}을 주어서 해결이 가능합니다. 출처: http://kreiz.tistory.com/entry/div-안의-img에-높이4px공백 [Monochrome]
1. js폴더안에 다운받은 html5 shiv.js 파일 추가 2. 사이에 아래코드 추가
항목 inline block inline-block 영역 컨텐츠 크기만큼 widthd와 height지정값 지정값이 없을시 부모의 가로값, 세로는 컨텐츠크기 지정값지정값이 없을시 너비 정렬 텍스트정렬에 영향을 받음 margin 과 paddingtable내부의 경우 vertical-align 텍스트정렬에 영향을 받음 박스모델 margin 좌우, padding, border, float margin, padding, border, float margin(auto x), padding, border, float 중첩요소 inline요소만 가능 inline과 block요소 모두가능 inline요소만 가능 특징 포지션이 텍스트와 유사하게 처리됨 양옆에 다른 요소가 올수없음 포지션이 텍스트와 유사하게 처리됨 엘리먼트..
rgba는 선언한 요소에만 적용되며 상속되지않는다.opacity는 모든 자식요소에 상속된다. background:rgba(255,0,0,0.5); background:red; opacity:0.5;
속성 radio value, name checkbox value, name submit value reset value button value select option value textarea name 폼제목 * title 속성을 이용하여 추가적인 설명을 넣어주면 음성만 출력되는 상황에서도 접근성을 높일수 있음. 아이디 비밀번호 label for 속성값과 input요소의 id값을 같은이름으로 연결하면 레이블텍스트 클릭시 연결된 input요소에 자동으로 포커스 이동 태그 속성autofocus-입력커서 표시placeholder - 힌트표시required - 필수필드 지정
기본 outline thead, scope, caption 웹접근성 필수 tfoot의 경우 해당 테이블 요소에 결과값이 있을경우 마크업 thead 다음에 위치하도록하여 접근성을 높임. 그외 결과값이 없는 테이블일 경우 thead 와 tbody로 마크업 scope속성scope="col" ->테이블 행의제목scope="row" -> 테이블 열의제목scope="colgroup" ->셀병합된 테이블 행의 제목 * html5 주의사항 summary 지원 하지않음. col width="20%" -> col style="width:20%" 변경사용
PHPSchool 지앤미님의 글을 퍼왔습니다. http://phpschool.com/gnuboard4/bbs/board.php?bo_table=tipntech&wr_id=62075&cwin=#c_62183 송효진님의 댓글 처럼, 저 또한 에만 아이디를 준 후, document.getElementById('myform').a.value 식으로 접근 하는 방식이 좋은 듯 합니다. 원문 -------------------------------------------------------------------------------------------- 위와 같은 태그가 있다고 합시다. 위 태그는 XHTML 1.0 Strict 유효성을 통과할까요? 네. 통과합니다. 다 아시는지 모르겠지만, 저는 input 태그에..
div { animation-name: moving; animation-duration: 5s; animation-timing-function: ease; animation-delay: 1s; animation-iteration-count: infinite; animation-direction: normal; animation-fill-mode: backwards; animation-play-state: running; } short [이름] [실행속도] [속도곡선타입] [딜레이시간] [반복횟수] [진행방향] [끝난후 위치] [실행or정지][name] [duration] [timing-function] [delay] [count] [direction] [fill-mode] [play-state] anim..