본문 바로가기

내마음대로만들어보자326

text-transform 1. 대문자로 변경하기 text-transform: uppercase; 2. 소문자로 변경하기 text-transform: lowercase; 3. 텍스트의 앞 한글자만 변환할 경우 text-transform: capitalize; 더보기 hello web is free 단, text-transform 은 IE9이상 에서만 지원이 가능하다고 한다. 2022. 4. 9.
transition 속성 - transition CSS 값의 변화가 일정 시간(duration)에 걸쳐 일어나도록 하는 것이다. 더보기 #resize { height: 100px; width: 150px; -webkit-transition: width 1s, height 3s; transition: width 1s, height 3s; } #resize:hover { width: 300px; height: 500px; } transition 의 속성 변화를 width, height값을 다르게 설정할 수도 있다. - transition 속성 - 모든 속성들은 transition에 한번에 사용할 수 있다. - transition-timing-function 속성 1. linear : 전환(transition) 효과가 처음부터 끝까지.. 2022. 4. 9.
인라인 구조 vs 블럭 구조 태그 종류 - 인라인태그 vs 블록구조 * 인라인구조 태그 , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , * 블록구조태그 , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , 2022. 4. 9.
여백 초기화 참고 여백 초기화 (참고) * 여백 초기화 */ body, div, ul, li, dl, dd, dt, ol, h1, h2, h3, h4, h5, h6, input, fieldset, legend, p, select, table, th, td, tr, textarea, button, form, figure, figcaption {margin:0; padding:0;} /* a 링크 초기화 */ a {color: #222; text-decoration: none;} a:hover {color: #2698cb;} /* 폰트 초기화 */ body, input, textarea, select, button, table {font-family: 'Nanum Gothic', AppleSDGothicNeo-Regular,.. 2022. 4. 9.

티스토리툴바