Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
Tags
- ES6
- 아이폰
- Javascript
- 자바스크립트
- codewars
- 맛집
- string
- LeetCode
- java
- 애플
- styled-components
- binary
- 반응형 웹
- 배포
- 리액트
- 알고리즘
- ECMAScript2015
- git
- c++
- Algorithm
- 컴퓨터
- 정규표현식
- db
- 식물키우기
- 자바
- 기억장치
- react
- 운영체제
- ECMAScript6
- 데이터베이스
Archives
- Today
- Total
목록Front-end/HTML· CSS (1)
에브리 저장소
[HTML/CSS] 카드형 UI 만들기
[HTML/CSS] 카드형 UI 만들기 안녕하세요.HTML/CSS를 사용해 간단한 애니메이션이 있는 카드형 UI를 만드는 방법에 대해 알아보겠습니다. 만들고자하는 카드형태는 둥근 모서리를 가지고 이미지 썸네일과 텍스트가 있는 형태입니다.그리고 입체감을 위해 그림자를 넣을겁니다!애니메이션은 마우스를 올려놓고 있으면 살짝 확대해서 보여줄 수 있도록 만들 겁니다. 위에서 말한대로 만들기 위해서 필요한 CSS 속성은 아래와 같습니다. 둥근 모서리 border-radius 그림자 box-shadow 이미지 썸네일 background-image 애니메이션 transition 만들면서 각 속성에 대해 알아보겠습니다.border-radiusborder-radius를 사용하면, 둥근 모서리를 가진 요소를 만들 수 있습니..
Front-end/HTML· CSS
2019. 2. 9. 23:42