1. text-shadow: 텍스트에 그림자 효과 넣기 text-shadow: none | ; 속성값 설명 '텍스트~그림자'의 가로 거리. 필수로 작성해야 하는 속성. (+) 값: 텍스트의 오른쪽으로 그림자 생김. (-) 값: 텍스트의 왼쪽으로 그림자 생김. '텍스트~그림자'의 세로 거리. 필수로 작성해야 하는 속성. (+) 값: 텍스트의 아래쪽으로 그림자 생김. (-) 값: 텍스트의 위쪽으로 그림자 생김. 그림자가 번지는 정도. (+) 값: 그림자가 모든 방향으로 퍼져나가서 그림자가 크게 표시됨. (-) 값: 그림자가 모든 방향으로 축소되어 보임. default 값은 0임. 그림자 색상 지정. 한 가지 색상으로만 지정할 수도 있고, 공백으로 구분해 여러 색상을 지정할 수도 있음. default 값은 현..

1. text-align: 텍스트 정렬하기 text-align: start | end | left | right | center | justify | match-parent ; 속성값 설명 start 현재 텍스트 줄의 시작 위치에 맞춰 문단을 정렬. end 현재 텍스트 줄의 끝 위치에 맞춰 문단을 정렬. left 왼쪽에 맞춰 문단을 정렬. default 값. 오른쪽에 여백이 존재한다. right 오른쪽에 맞춰 문단을 정렬. center 가운데에 맞춰 문단을 정렬. justify 양쪽에 맞춰 문단을 정렬. left와 달리 오른쪽에 여백이 없다. match-parent 부모 요소를 따라 문단을 정렬. 예제 1. 껍질에 붉은 빛이 돌아 레드향(감평甘平)이라 불린다. 레드향은 한라봉과 귤을 교배한 것으로 일반 ..

color: ; 1. 16진수로 표현하는 방법 1) hsl, hsla Hue(색상): 0°는 빨강, 120°는 초록, 240°는 파랑, 사이에 나머지 색들이 배치됨. Saturation(채도): 0%는 회색이 섞인 색, 100%는 아무 것도 섞이지 않은 원래 색 Lightness(명도): 0%는 가장 어두운 색, 50%가 원래 색, 100%는 흰색 Alpha(불투명도): 0%는 완전 투명하게, 50%는 반쯤 투명하게, 100% 그냥 완전 불투명 (alpha는 %값 대신에 0 ~ 1까지의 숫자로 표시할 수도 있다. 0 = 0%, 1 = 100%. 0.5 = 50%) 2) 영문명 색상 흔히 알고 있는 색은 영문명으로도 표시할 수 있다. (red, blue, yellow, green, black, white ..

https://fonts.google.com/?subset=korean&preview.size=64&preview.layout=row Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com 책에 나온 Nanum Pen Script로 web font를 바꿔봐야겠다. 위의 링크 Google Font로 들어가서 Language를 Korean으로 고르고 Nanum Pen Script 찾아서 클릭해 들어가서 스크롤을 조금만 내리면 아래 화면이 나온다. HTML+CSS+JavaScript ↓

Web font를 사용하면, 사용자가 가지고 있지 않은 글꼴이어도, font-family 속성을 사용하지 않아도, 웹 페이지를 만든 사람이 원하는 글꼴로 보일 수 있다..! @font-face { font-family: '글꼴 이름'; src: local('글꼴 이름'), url('글꼴 다운로드 위치 1') format('woff'), url('글꼴 다운로드 위치 2') format('truetype'), url('글꼴 다운로드 위치 3') format('svg'); } font-family: 'blah blah' 앞으로 이 글꼴은 'blah blah'란 이름으로 부를 거야. src source의 약자. 파일의 경로를 지칭한다. local('글꼴 이름') 사용자의 컴퓨터에 이 글꼴이 있나 먼저 찾아봐! ..