10_배경이미지포함레이아웃(웹페이지) 10_배경이미지포함레이아웃(코드)

09_배경이미지(웹페이지) 09_배경이미지(코드)

08_테두리, 그림자 콘텐츠(웹페이지) 08_테두리, 그림자 콘텐츠(코드) -overflow: hidden : 내부 요소가 부모의 요소에 침법할 때 사용한다. 부모 요소에 적용 시 영역을 벗어나는 부분이 보이지 않게 된다. -overflow: scroll : 영역을 벗어나는 부분은 스크롤로 만든다.

07_테두리, 그림자(웹페이지) 07_테두리, 그림자(코드) -border : 선의굵기 선타입 색상; 속성값 : solid, dotter, dashed, double, groove, ridge, inset, outset -box-shadow : x축 y축 blur(흐릿함정도) spread(그림자의크기) 색상; x축이 양수일 경우 오른쪽에, 음수일 경우 왼쪽에 그림자 생성 y축이 양수일 경우 아래쪽에, 음수일 경우 위쪽에 그림자 생성 inset은 그림자의 효과를 안쪽으로 적용

06_리스트아이템(웹페이지) 06_리스트아이템(코드) 웹폰트 적용하는법! 사용사이트 : 눈누 1. 폰트 사이트에 웹폰트로 사용할 수 있는 링크를 복사한다. 2. html의 에 붙여넣는다. 3. font-family만 따로 복사하여 적용하고 싶은 곳에 붙여넣기한다. 4. 잘 적용되었는지 확인.

05_여백(웹사이트) 05_여백(코드) Lorem ipsum : 시각적 연출을 보여줄 때 사용하는 표준 채우기 텍스트(의미없는 말) -> 한글로 된 로렘입숨도 구글 등에서 검색하여 사용 가능

04_모서리곡선 콘텐츠(웹페이지) 04_모서리곡선 콘텐츠(코드)

03_모서리곡선+원형 (웹페이지) 03_모서리곡선+원형 (코드)