[티스토리]오디세이 스킨을 html/css로 일부 변경! 프로필 사진 영역을 내맘대로 해보자

티스토리에 초보자도 기본적으로 쓸 수 있는 "오디세이"스킨을 적용해봤더니 내 프로필 사진이 가로로 눌려서 이상하게 나오고 동그란 틀 모양도 마음에 안들어서 내 맘대로 바꿔봤다.

아래가 Before.

CSS 에서 .area-aside .box-profile .img-profile 에 해당하는 부분이 프로필 사진 관련된 부분인 것 같아서 이것 저것 건드려봤다. 기본 값이 가로 140, 세로 140px로, 1:1 비율로 설정되어 있어 왠지 이것 때문에 가로로 눌려서 나오는 것 같은 느낌이 팍 들었다.

 

 

그래서 width를 200, height를 140px로 설정. 그리고 저 동그란 원형 틀을 사각형 틀로 바꾸고 싶어서 혹시나 하는 마음에 border-radius 값을 조절하니 값이 낮아질수록 사각형 모양에 가까워졌다. 10정도로 줄이니 거의 사각형 모양이고 모서리 부분만 살짝 둥글다.

 

 

 

혹시나 기본적으로 제공되는 오디세이 스킨의 프로필 사진 부분을 커스터마이징 하고 싶은 분들을 위해 올립니다.

 

출처는 그냥 제 감..