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

잘살아보자

프로필 보기 이 회원 글보기

· 11년 전 · 조회 3646 3646

기본적인 모양

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가 못하는 것이 없네요.

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

게시글 목록

번호	제목	글쓴이	조회	날짜
27980	이런 네비게이션 소스 혹시 아시는분 5	삼관왕	1,665	11년 전
7164	영카트5 orderform.php 수정 관련 질문입니다.	ImSG	924	11년 전
31729	부트스트랩 Bootstrap 강좌 5. Bootstrap JS Collapse 2	신리	2,209	11년 전
31726	부트스트랩 Bootstrap 강좌 4. Bootstrap Components 2	신리	1,711	11년 전
31725	부트스트랩 Bootstrap 강좌 3. Bootstrap CSS Ref.	신리	3,793	11년 전
31720	부트스트랩 Bootstrap 강좌 2. Bootstrap Case 4	신리	2,256	11년 전
31711	부트스트랩 Bootstrap 강좌 1. Bootstrap Basic 8	신리	4,500	11년 전
7159	자바스크립트 롤오버좀 도와주세여 ㅠㅠ 4	호식이와미돌	1,270	11년 전
27974	고수님들 도와주세요 ㅠㅠ 5	호식이와미돌	1,131	11년 전
19734	PHP [알고리즘] 단순 연결 리스트를 이용한 스택(stack) 1	슈와이	1,776	11년 전
19730	PHP [알고리즘] 배열로 구현하는 스택(stack) 3	슈와이	1,747	11년 전
19729	PHP [알고리즘] 배열 역순	슈와이	1,312	11년 전
27969	도서 추천 부탁드려요~~ 4	나는웹디다	961	11년 전
7142	php 개발시에 다들 eclipse 사용하십니까? 16	멋진남자임	1,608	11년 전
19728	jQuery remove()를 이용하여 엘리먼트 삭제하기	잘살아보자	978	11년 전
19725	PHP 개발하면서 도움이 많이 되는 array 함수 extract 소개합니다 2	천국나무	1,081	11년 전
7130	php로 개발하면서 array 를 얼마 많금활용 하세요? 11	천국나무	1,297	11년 전
19722	jQuery 동일 엘리먼트 순번 알아내기 2	잘살아보자	1,111	11년 전
19719	PHP [클래스] abstract 추상클래스 2	슈와이	869	11년 전
7124	페이스북 같은 사이트를 하나 만들려면... 5	사랑한데이	2,046	11년 전
19718	jQuery width(), height() 메서드를 이용하여 가로크기, 세로 크기 알아내기	잘살아보자	1,866	11년 전
19717	jQuery offset() 메서드를 이용하여 left, top 값 set, get 하기	잘살아보자	3,038	11년 전
19716	jQuery position() 메서드 객체에 대한 좌표값	잘살아보자	1,011	11년 전
19715	jQuery closest : 선택된 요소에서 최초의 부모요소 객체를 얻어온다.	잘살아보자	777	11년 전
7122	그누보드를 사용한 사람은 쇼핑몰 제작에는 영카트가 좋을까요? 1	디스달	861	11년 전
30959	CSS css !important 의 활용 3	잘살아보자	2,751	11년 전
19714	PHP [클래스] 여러 종류의 객체를 하나의 배열로 다루기	슈와이	1,009	11년 전
31710	jQuery Mobile jQuery Mobile 강좌 19. Select Menus	신리	1,208	11년 전
31709	jQuery Mobile jQuery Mobile 강좌 18. Text Inputs	신리	711	11년 전
19713	PHP 배열에서 그룹별로 합계 구하기(group by)	슈와이	1,495	11년 전
7117	개발자님들, 슬로우쿼리 문제 좀 봐주세요!!! 4	mijaya	1,489	11년 전
19712	PHP [클래스] instanceof 인스턴스 확인	슈와이	898	11년 전
7111	서버이전을 하였는데 문제가 생겻읍니다 5	까망아이	1,079	11년 전
31708	jQuery Mobile jQuery Mobile 강좌 17. Form Basic	신리	759	11년 전
31707	jQuery Mobile jQuery Mobile 강좌 16. Filters	신리	719	11년 전
19710	PHP preg_split 를 이용한 문자열 나누기와 중복값 제거후 정렬 1	슈와이	1,549	11년 전
31706	jQuery Mobile jQuery Mobile 강좌 15. List Content	신리	886	11년 전
31705	jQuery Mobile jQuery Mobile 강좌 14. List Views	신리	794	11년 전
31704	jQuery Mobile jQuery Mobile 강좌 13. Layout Grids	신리	901	11년 전
19709	PHP 중복된 값 중 한개만 제거 2번째 이야기	잘살아보자	1,087	11년 전
19707	PHP 중복된 값 중 제일 처음에 있는 값만 제거하기 1	잘살아보자	731	11년 전
31703	jQuery Mobile jQuery Mobile 강좌 12. Tables	신리	778	11년 전
19706	jQuery class가 있는지 없는지 체크하기	잘살아보자	1,291	11년 전
31702	jQuery Mobile jQuery Mobile 강좌 11. Collapsibles	신리	817	11년 전
19705	PHP 배열에서 중복 값 없애기	잘살아보자	1,315	11년 전
31701	jQuery Mobile jQuery Mobile 강좌 10. Panels	신리	808	11년 전
19704	PHP [클래스] Singleton 싱글톤	슈와이	976	11년 전
31700	jQuery Mobile jQuery Mobile 강좌 9. Navigation Bars	신리	1,004	11년 전
31699	jQuery Mobile jQuery Mobile 강좌 8. Toolbars	신리	755	11년 전
31698	jQuery Mobile jQuery Mobile 강좌 7. Popups	신리	784	11년 전
7107	모바일 웹 연동 웹앱에서 본인인증 후 경로 질문입니다.. 3	싱글탱글	1,017	11년 전
19703	JavaScript str_pad 자릿수만큼 특정문자로 채우기	슈와이	1,951	11년 전
31697	jQuery Mobile jQuery Mobile 강좌 6. Icons	신리	784	11년 전
31696	jQuery Mobile jQuery Mobile 강좌 5. Buttons	신리	794	11년 전
19702	PHP [클래스] Overloading 오버로딩2	슈와이	735	11년 전
19701	PHP [클래스] Overloading 오버로딩1	슈와이	1,149	11년 전
31695	jQuery Mobile jQuery Mobile 강좌 4. Transitions	신리	802	11년 전
27965	포커싱에 맞게 오브젝트가 보여지는 방법 문의요! 3	김우너석	710	11년 전
31694	jQuery Mobile jQuery Mobile 강좌 3. Pages	신리	1,040	11년 전
19700	PHP 날짜 문자 1분 전, 1시간 전, 1일 전 표시	레어닉	1,362	11년 전
31693	jQuery Mobile jQuery Mobile 강좌 2. Install	신리	995	11년 전
19699	PHP [클래스] 포함관계를 통한 다중상속(?)	슈와이	920	11년 전
31692	jQuery Mobile jQuery Mobile 강좌 1. Introduction	신리	965	11년 전
31691	jQuery Mobile jQuery Mobile 강좌 0.home	신리	1,797	11년 전
19698	PHP [클래스] __construct 조상클래스의 생성자	슈와이	867	11년 전
19697	PHP [클래스] Overriding 오버라이딩	슈와이	926	11년 전
19696	jQuery 마우스 오버 위치에 따라 툴팁 생성 및 자동 이동	잘살아보자	2,704	11년 전
19694	jQuery animate 사용법 및 animate가 중복 될 경우 처리 하는 방법 1	잘살아보자	2,251	11년 전
19693	jQuery 제이쿼리 동적으로 생성된 객체에 이벤트 생성하기	잘살아보자	1,137	11년 전
19692	jQuery 제이쿼리 bind, unbind 이벤트 생성, 해제하기	잘살아보자	1,626	11년 전
19691	PHP php, 강제로 에러 출력하게 하기	잘살아보자	1,237	11년 전
19690	JavaScript shuffle 배열섞기	슈와이	1,153	11년 전
19689	jQuery 제이쿼리 모음 사이트	잘살아보자	1,285	11년 전
19688	PHP 1원팁] IP 대역 비교	잘살아보자	1,888	11년 전
19687	PHP [클래스] Interface 인터페이스	슈와이	926	11년 전
7105	네이버/다음 캘린더 외부 삽입은 막혀있나요? 1	그누5입문	1,931	11년 전
30955	CSS sprite 이미지를 css코드로 변환해주는 웹도구 3	우산11	2,159	11년 전
7100	전혀 다른 시스템의 DB이전 어떻게 처리 하시나요? 4	Terrorboy	855	11년 전
19681	PHP input 쉽게 관리하기 5	레어닉	1,000	11년 전
7097	작업은 어느정도 되가나요? 에 어떻게 대답을 해야될까요? 2	클베	709	11년 전
19678	JavaScript 서버시간을 사용한 전자시계 2	슈와이	1,672	11년 전
7089	Sphinx search 적용 후기 7	진서기	1,541	11년 전
7086	서브도메인 설정 도움이필요합니다 ㅜㅜ 2	sogo87	1,027	11년 전
7084	여쭤봅니다. 어디서 검색해오는지 1	쥬드로옹	909	11년 전
7082	제발 도와주세요 1	꿈의세계	684	11년 전
19677	PHP [함수] 1원 팁 - fwrite() 함수 관련	잘살아보자	1,064	11년 전
30953	기타 영역 스크롤 질문드립니다. 1	별이님	1,517	11년 전
7080	html언어에서요,폰트를 일정 사이클로 바꿔주고 싶은데 어떻게해야하나요? 1	presee	586	11년 전
7077	홈페이지 주소 설정 문의입니다.. 2	sogo87	777	11년 전
7071	테이블 태그 관련 문의 5	빅맨	856	11년 전
7070	chart 관련 javascript framework	브라이언2	877	11년 전
7066	귀차니즘은 개발자를 발전하게 만든다. 3	Terrorboy	1,081	11년 전
19676	JavaScript 구글 웹사이트 번역기를 내 사이트에 달기	위토즈	2,613	11년 전
19674	웹서버 htaccess를 이용하여 짧은주소 및 url 주소 리다이렉션하기 1	잘살아보자	2,271	11년 전
27961	움직이는 퀵메뉴 하단에 닿기 전에 멈추는 방법이 있을까요? 3	dethos79	1,834	11년 전
7063	SSL 적용하면 속도가 혹시 & 질문2개 2	멋진남자임	1,394	11년 전
7061	PHP 의 5.6 메인 브랜치의 정식 버전이 출시 1	카이루	1,337	11년 전
19669	jQuery input value 값 1씩 한꺼번에 증가시키기 4	열매	2,309	11년 전
7060	안드로이드 UI 노과다	컴대장	1,573	11년 전
20842	도로명주소 juso.sir.co.kr 도로명 주소 검색 시스템 구축 가이드 - 전체파일 7	편리	2,774	11년 전

이전 다음

8 9 10 11 12

전체 목록