워드프레스 홈페이지나 블로그에서 아래와 같이 플레잉 카드와 후버 효과를 만드는 방법에 대해 안내 드립니다.
워드프레스 홈페이지 플레잉 카드 이미지 후버 효과_2
원하는 이미지를 삽입합니다.
![워드프레스](https://jejumarron.com/wp-content/uploads/2024/06/62.png)
‘이미지‘를 아래와 같이 설정합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/63.png)
‘이미지‘의 ‘테두리‘를 아래와 같이 설정합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/64.png)
아래와 같이 해당 ‘컨테이너‘를 클릭 후 ‘패딩‘을 아래와 같이 설정합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/65.png)
아래와 같이 해당 ‘컨테이너‘를 클릭 후 ‘Justify Content‘와 ‘간격‘을 아래와 같이 설정합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/66.png)
‘레이아웃’의 ‘추가 옵션’에서 ‘넘침 처리’를 아래와 같이 설정합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/67.png)
‘제목’을 ‘컨테이너’ 안으로 드래그 합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/68.png)
‘제목’의 ‘색상’과 ‘타이포그래피’를 아래와 같이 설정합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/69.png)
‘제목‘ 우 클릭해서 ‘복제‘를 클릭합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/70.png)
복제된 ‘제목‘의 ‘색상‘과 ‘타이포그래피‘를 아래와 같이 설정합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/71.png)
2개의 ‘제목‘을 포함하고 있는 ‘컨테이너‘를 클릭합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/103.png)
‘Justify Content‘와 ‘간격‘을 아래와 같이 설정합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/72-1.png)
‘패딩‘을 아래와 같이 설정합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/73-1.png)
‘반응형 모드‘에서 ‘모바일 초상화‘를 클릭합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/74-2.png)
아래와 같이 ‘컨테이너‘를 클릭 후 ‘너비‘를 아래와 같이 설정합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/75-2.png)
아래와 같이 ‘컨테이너‘를 클릭 후 ‘패딩‘을 아래와 같이 설정합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/76-2.png)
‘제목‘을 클릭 후 ‘크기‘를 아래와 같이 설정합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/77-2.png)
‘여백‘을 아래와 같이 설정합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/78-1.png)
아래와 같이 ‘컨테이너‘를 클릭 후 ‘패딩‘을 아래와 같이 설정합니다.
![](https://jejumarron.com/wp-content/uploads/2024/06/79-2.png)