블로그 스킨 프로필, 커버이미지 html 편집 어렵지 않아요

 

 

어포스트님이 제작한 반응형 2단 매거진 C 스킨

수정 방법입니다.

 

스킨 내에서 커버 슬라이더와 배너 이미지를

모서리 둥글게 하는 방법입니다!

 

코딩 알못이라 내가 다시보려고 쓰는 글.

 

 

 

 

https://blogpack.tistory.com/392

티스토리 스킨 - 반응형 2단 매거진C 티스토리 스킨 배포합니다.

 

 

 

 

스킨 편집에 들어가시면

html 편집 버튼으로 들어가서 CSS를 클릭해줍니다.

 

 

 

 

1. 가로 풀 배너

 

 

 

 

 

이렇게 위 이미지처럼 가로 풀 배너 이미지

모서리를 둥글게 만들어 볼게요

 

 

 

 

소스코드 쪽을 한번 클릭하시고

Ctrl+F 버튼을 눌러

 

cover-banner ul li
를 검색하시고

 

border-radius: 10px;

이 행을 추가해 주세요!

 

10의 값은 반지름 픽셀 값이니

적당히 조정하시면 됩니다!

 

.cover-banner ul li{
	height: 100%;
	padding: 0 30px;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	border-radius: 10px;
}

 

 

 

 

 

2. 커버 슬라이더

 

 

 

 

제일 상단에 위치한 흐르는 이미지의

모서리를 둥글게 해 볼게요

 

 

 

아까와 똑같이 

[스킨 편집] - [html 편집] - [CSS]에서

 

소스코드 쪽을 한번 클릭하시고

Ctrl+F 버튼을 눌러

 

.cover-slider

를 검색하시고

 

border-radius: 10px;

이 행을 추가해 주세요!

 

.cover-slider {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 400px;
	margin: 0 auto 20px;
	padding: 0;
	box-sizing: border-box;
	border-radius: 10px;
}

 

 

적용하고 새로고침 후 

안 나타나거나 적용이 안되었으면

댓글로 남겨주세요!

 

 

 

아, 응용 버전 하나 더!

 

 

 

3. 블로그 프로필 이미지

 

거꾸로 블로그 프로필의

원 이미지를

네모나게 하고 싶다면

 

 

blogger-profile 을 검색해 

border-radius: 0%; 로

변경해주시면 됩니다!