뇨내

Font 폰트 @font-face { font-family : ; src: url( ); } font-family: ; - 서버상의 폰트를 클라이언트에게 실시간 제공 - 클라이언트 pc에 폰트가 설치되지 않는다. 참고용 폰트 사이트 Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com 눈누 - 상업용 무료한글폰트 사이트 상업적으로 이용할 수 있는 무료 한글 폰트를 모아 놓은 사이트 눈누 noonnu.cc

Shadow 그림자 1. text-shadow: x y blur color 2. box-shadow: npx npx npx color 블럭태그, 인라인태그 그림자 효과 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 Document .box { border: 1px solid black; width: 200px; height: 100px; margin: 20px; } /* 개체간의 중첩된 margin은 합이 아니라, 큰 마진이 적용된다. */ /* #box1 { margin-bottom: 10px; } #box2 { margin-top: 20px; } */ 상자1 상자2 상자3 안녕하세요. 삐옥이입니다...

Alignment 정렬 정렬, Alignment - 인라인 태그와 블럭 태그의 수평 정렬 1. 인라인 태그 - 내용물 정렬 불가능 왜? 여백이 없다. 2. 블럭 태그 - 내용물 정렬 가능 왜? 여백이 있다. 태그 자체 정렬 1. 인라인 태그 자체를 정렬하려면 - 블럭 태그인 부모를 가져야 한다. > 즉, 부모에게 text-align을 사용한다. 2. 블럭 태그 - 불가능 > 좌우 공간이 없다. > 너비 100% - 가능하게 하려면 좌우 margin이용 일반적인 정렬 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 Document #s1 { background-color: yellow; text..

Position 1. padding 2. margin 3. position 4. trasform > CSS3 position: static | absolute | relative | fixed ; position : 요소의 위치를 지정하는 속성 - 좌표값 사용 - x(left), y(top) - 좌표를 지정하는 방식이 여러개 제공(좌표계 > 기준점) 1. position: static - 정적 좌표 - 기본값 - FlowLayout 방식 - 워드 프로세스 방식 - 코딩 순서대로 출력되는 방식 위 -> 아래, 왼쪽 -> 오른쪽 - 좌표값 지원 안됨(left, top 사용 불가능) 2. position: absolute - 절대 좌표 - 기준점: 문서의 좌측 상단 - 모든 태그가 동일하게 문서의 좌측 상단을..

float float: left | right ; - float이란 이름의 속성이 있다. - 기존의 출력정책을 깨고, 혼자 자신의 위치에서 벗어나서 현재라인의 좌측(우측) 끝으로 이동한다. - 이미지, 텍스트 > 인라인 태그 > 같은 라인에 출력된다. - 이미지와 텍스트의 높이가 서로 다르다. -> 그래서 여백이 생기게됨 -> 메꿔야함 float 이용! - align은 이미지를 정렬하려고 만든속성이 아니다.(HTML) - 서식이라서 CSS이용해야함 추가적인 밑줄이 필요할때 로 이용해도 되나 border-bottom 을 이용해서 px단위로 만들 수 있다. 1 2 3 4 5 6 7 8 #title { /* text-decoration: underline dashed red 2px; */ border-bott..