KCP API결제 버전 배포 - exec() 불가 환경 대응KCP exec() 불가 대응 버전 배포
이전
목록
다음
컴

CSS : box-shadow, 박스 쉐도우(그림자) [펌]

잘살아보자
프로필 보기게시판 작성글 보기전체 작성글 보기전체 댓글 보기
 · 2014-08-11 (월) 19:03:24 · 6886
기본적인 모양 
box-shadow: 2px 2px 5px #000; 

문법 
box-shadow: h-shadow v-shadow {blur {spread}} {color} {inset}; 
h-shadow : 수평 그림자 위치 (필수) (음수일 경우 위로) 
v-shadow : 수직 그림자 위치 (필수) (음수일 경우 왼쪽으로) 
blur : blur(흐리게)효과수준 (옵션) 
spread : 그림자 크기 (옵션) 
color : 그림자 색 (옵션) 
inset; 내부 그림자 형식 (옵션)(inset 이라고 적음) 

특징 
h-shadow, v-shadow 로 상하, 좌우 로 설정 가능 
blur 및 spread (그림자 크기) 설정가능 
spread (그림자 크기) 설정시 
위치도 주의해서 설정 
blur를 무조건 같이 표시해야한다.(0px라도) 
레이아웃으로의 위치를 차지하지 않는다. 
단순한 꾸밈으로 동작하며 box-shadow로 인한 레이아웃 뒤틀림이 없음. 

브라우저 지원 
IE9+ 
Firefox 
Chrome 
Opera 
Safari 5.1.1 (윈도우 최후 버전은 5.1.7 이므로 지원은 됨) 

(링크에 예제 모양 몇개와 w3schools쪽 링크도 붙여놨어요) 

데코레이션용으로 강조를 위해서는 꽤 좋은 기능 같아서... 
(outline 으로 했는데 안 예쁘면 한번 생각해보세요.)

 

 

 

위 자료는 펌 자료인데요..

특별한 기능을 하는 css 찾다가.. 찾은것이에요.

css가 못하는 것이 없네요.

#퍼블리셔팁 #퍼블리셔 #팁자료실 #css
|
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
태그 필터 (최대 3개) 전체 개발자 소스 기타 mysql 팁자료실 javascript php linux flash 정규표현식 jquery node.js mobile 웹서버 os 프로그램 강좌 썸네일 이미지관련 도로명주소 그누보드5 기획자 견적서 계약서 기획서 마케팅 제안서 seo 통계 서식 통계자료 퍼블리셔 html css 반응형 웹접근성 퍼블리싱 표준화 반응형웹 홈페이지기초 부트스트랩 angularjs 포럼 스크린리더 센스리더 개발자톡 개발자팁 퍼블리셔톡 퍼블리셔팁 기획자톡 기획자팁 프로그램강좌 퍼블리싱강좌
+
제목 글쓴이 날짜 조회
14-08-26 조회 3,448
14-08-26 조회 3,675
14-08-26 조회 4,275
14-08-26 조회 3,587
14-08-26 조회 3,770
14-08-26 조회 3,698
14-08-26 조회 3,516
14-08-26 조회 3,664
14-08-26 조회 3,603
14-08-26 조회 3,779
14-08-25 조회 4,145
14-08-16 조회 4,266
14-08-12 조회 4,136
14-08-05 조회 3,967
14-08-04 조회 4,823
14-08-04 조회 3,993
14-08-01 조회 5,326
14-07-29 조회 4,375
14-07-10 조회 4,162
14-07-08 조회 4,820
14-07-08 조회 4,285
14-07-05 조회 4,057
14-05-26 조회 5,453
14-05-26 조회 4,249
14-05-21 조회 4,566
14-05-19 조회 7,504
14-05-17 조회 6,947
14-04-30 조회 7,332
14-04-27 조회 4,776
14-04-26 조회 4,923
14-04-13 조회 4,917
14-04-13 조회 4,173
14-03-25 조회 6,497
14-03-25 조회 4,151
14-03-12 조회 4,030
14-03-12 조회 5,404
14-02-24 조회 4,712
13-12-27 조회 4,003
13-11-18 조회 4,327
13-11-18 조회 6,783
13-10-17 조회 4,819
13-10-03 조회 6,293
13-10-02 조회 4,202
13-09-29 조회 4,739
13-09-29 조회 4,047
13-09-17 조회 3,821
13-09-11 조회 6,249
13-09-09 조회 4,277
13-09-05 조회 9,549
13-08-23 조회 5,839
13-08-22 조회 5,368
13-08-22 조회 4,573
13-08-22 조회 5,087
13-08-17 조회 5,989
13-08-17 조회 4,333
13-07-11 조회 5,531
13-07-11 조회 4,471
13-07-08 조회 4,112
13-07-04 조회 4,259
13-07-04 조회 4,163
13-07-04 조회 4,040
13-07-03 조회 5,949
13-07-01 조회 3,799
13-07-01 조회 3,746
13-07-01 조회 4,613
13-06-21 조회 6,340
13-06-14 조회 4,863
13-06-11 조회 3,709
13-06-06 조회 5,442
13-06-05 조회 4,162
13-05-11 조회 4,931
13-05-10 조회 4,497
13-05-10 조회 4,687
13-05-10 조회 4,202
13-05-08 조회 4,420
13-05-08 조회 3,683
13-05-08 조회 4,102
13-05-08 조회 5,308
13-04-05 조회 6,071
13-03-31 조회 5,684
13-03-24 조회 4,046
13-03-24 조회 6,222
13-03-23 조회 3,723
13-03-21 조회 3,817
13-03-20 조회 3,783
13-03-20 조회 4,269
13-03-20 조회 3,825
13-03-20 조회 3,896
13-03-20 조회 6,076
13-03-20 조회 4,108
13-03-20 조회 4,755
13-03-19 조회 5,817
13-03-14 조회 3,968
13-03-14 조회 4,318
13-03-14 조회 4,586
13-03-08 조회 4,182
13-03-03 조회 4,588
13-02-24 조회 5,015
13-02-21 조회 4,815
13-02-19 조회 4,825
글쓰기