DHTML/CSS/META 썸네일형 리스트형 DIV, SPAN, FIELDSET 공통점 ▶ DIV, SPAN, FIELDSET 공통점 - 특별한 태그 속성이 없음 - 쓰이는 style속성은 동일. - style속성에 따라 형태가 달라짐 - 태그내에 속성을 적지 않아도 시작태그와 마감태그 사이에 들어가는 내용에 따라 그 공간의 크기도 자동으로 결정 ▶ DIV, SPAN, FIELDSET 다른점 DIV - 태그의 시작 전후에 자동으로 줄바꿈 기능 SPAN - 태그의 시작 전후에 자동 줄바꿈 기능 없음. 이웃으로 위치. FIELDSET - DIV, SPAN태그와 달리 테두리 존재. 모서리 부분이 둥근것이 특징. - FIELDSET 태그 하위로 제목 추가 가능 (ex. 제목) - 태그의 시작 전후에 자동으로 줄바꿈 기능 존재 ▶ 중요 style 정리 * width, height - 크기 결정 속성.. 더보기 display:none,visibility:hidden display:none 를 하게되면 html은 구조상에서 사라지게 되고 visibility:hidden 의 경우에는 단지 눈에만 보이지 않을 뿐 공간을 차지 하고 있다. 더보기 text-transform 속성 1. text-transform 속성 이 속성은 요소 글자의 대/소문자를 전환한다. 속성 값에 대한 의미는 다음과 같다. capitalize : 단어의 첫번째 글자를 대문자로 지정한다. uppercase : 단어의 모든 글자들 대문자로 지정한다. lowercase : 단어의 모든 글자들 소문자로 지정한다. none : 변환하지 않는다. 2. text-indent 속성 이 속성은 요소의 첫 번째 행의 들여쓰기를 지정한다. 음수값은 허용되지않는다. 음수값을 적용하면 첫번째 행이 요소 범위에서 튀어나온다. 속성 값에 대한 의미는 다음과 같다. 길이 : 길이를 지정한다. 음수를 지정하면 내어쓰기가 된다. 퍼센테이지 : 백분율(%) 값을 지정한다. 부모 요소를 기준으로 계산된다. 더보기 ie6 에서 li 높이 공간생김 문제!! ie6 에서 li 높이 기본 높이가 있는것 같아 높이를 0이나 1로 주어도 공간이 생겨서 그 밑에 있는 li 않에 텍스트 조차 자동으로 공간이 생겨 꼭 마진값을 먹은것처럼 보였다. 해결방법 overflow:hidden; 드디어 해결됬네... 아어 정말 커스트마이징은 시간이 너무 오래걸리고 사람 늪에 빠진다 더보기 CSS의 display 속성 CSS의 display 속성은 해당 엘레멘트가 화면에 어떻게 보여지는지를 결정하는 역할을 합니다. display 속성의 값은 다 따지면 19가지나 되지만, 실제로 자주 쓰이는 것은 inline과 block, inline-block, none 값이며, 이외의 것은 브라우저에서 지원하지 않는 것도 많기 때문에 불안정해서 사용되지 않는다고 하네요. block : 블록박스로 만든다. inline : 인라인 박스로 만든다. inline-block : 블록박스로 만들어지지만, 인라인 박스처럼 배치된다. (CSS2.1 권고후보에 추가) none : 박스를 만들지 않으며 시각적으로 완전히 보이지 않는다. inherit : 상위 요소의 display속성을 상속받는다. table : 블록레벨의 표로 만든다. (table).. 더보기 SPAN 속성 부분의 태그는 크게 block 속성을 가지거나 또는 inline 속성을 지니고 있습니다. block 속성은 div 와 같이 한줄에 하나의 요소만 있고 주변의 요소를 강제로 줄바꿈 시키는 성질이 있습니다. 한편 inline 요소로는 span 태그와 같은 것들이 있는데 이것들은 한 줄에 여러개의 inline 요소들이 함께 어울릴 수 있습니다. span 태그는 inline 요소이므로 기본적으로 width 값을 갖지 않고 내부 콘텐츠의 너비가 곧 자신의 너비가 됩니다. span 태그에 width 값을 주려면 display:block 으로 span 의 기본 성질인 inline 속성값을 block 속성값으로 변경해 주면 됩니다. IE에서는 된다고 하셨지만 그것은 IE가 CSS를 잘못 렌더링 하고 있는 것입니다. 짐.. 더보기 visibility:hidden 과 display:none 웹 화면상에서 필요 없는 부분이나 a:hover 부분을 보이지 않게 하기 하기 위하여 visibility:hidden 과 display:none을 하는 경우가 종종 있습니다. 이것들의 차이는 차이점이 하나 있습니다. display:none을 하게 되면 html 은 구조상에서 사라 지게 되고 visibility:hidden의 경우에는 단지 눈에만 보이지 않을 뿐 자기의 영역을 고수 하여 다른 것들의 위치 선정에 영향을 주게 된다는 것입니다. a b 기존의 이런 소스를 실행하면 이렇게 나옵니다. 하지만 스타일 시트에 visibility:hidden; 을 추가 해주면 위와 같이 영역이 포함 된 상태로 나오나, display:none;과 같은 경우에는 아래와 같이 그 영역을 잡아 먹고 올라와서 b가 보여지.. 더보기 INPUT 박스에 입력시 한글/영어만 입력할 수 있도록 선택하기 css (한글입력 영어입력) input 박스로 입력을 받을 경우 한글 또는 영어로만 입력을 받고 싶을때 이용되는 style이다. style 속성중 ime-mode를 이용하는데 속성값은 아래와 같다. ime-mode: 속성값 설명 auto 현재 선택모드로 유지 active 기본값으로 한글모드를 선택 inactive 기본값으로 영문모드 선택 disabled 영문모드만 가능(한글입력 안됨) 사용예) ID: 위와 같이 스타일 값을 지정하면 아이디 입력란에는 한글 입력이 되지 않는다. 입력항목에 한글만 입력을 한다던가 숫자만 입력을 해야한다던지 하는 경우에는 자바스크립트를 이용하여 제어할 수 있다. [출처] [CSS/STYLE] INPUT 박스에 입력시 한글/영어만 입력할 수 있도록 선택하기|작성자 왕따짱 [출처] [CSS/STYLE] IN.. 더보기 이전 1 2 3 4 5 6 ··· 8 다음