CCZ-CROSS 스킨에 인용구 편집

CCZ-CROSS 스킨에 사용되는 인용구를 편집하고 싶은데 제공하는 블로그나 자료가 없어 이렇게 글을 올립니다. 아마 너무 간단해서 다루지 않을 수도 있을거라는 생각도 들었습니다만 제가 고생한 것을 생각해서 글을 올립니다.

구글에서 "CSS 인용구 편집"으로 검색하면 다양한 자료들을 얻을 수 있습니다. 부족하신 분들은 검색하셔서 참고하시기 바랍니다.

블로그 관리에서  [꾸미기-스킨편집]을 클릭하여 스킨편집 페이지로 이동합니다. 이 페이지에서 [html 편집] 버튼을 클릭하여 스킨편집 화면을 띄웁니다. [CSS]를 선택하고 맨 아래로 이동하신 후 아래의 CSS 소스를 복사해서 붙여넣기 하시기 바랍니다.

/* 본문 - 인용구 */
.entry blockquote {
  width: 90%;
  font-weight: bold;
  font-style: normal;
  background: #D4F4FA;
  border-left: 10px solid #1FAFDA;
  border-bottom: 1px solid #1FAFDA;
  margin: 1.5em 10px;
  padding: 0.5em 10px;
}

.entry blockquote p {
  display: inline;
}

인용구 설정값의 의미는 아래와 같습니다. 추가적인 내용은 아래의 참고 블로그를 방문해 주세요.

1.Width 90%:인용구 상자의 상대 크기
2.font-weigth bold:글꼴 진하게 표시
3.font-style normal:글꼴 스타일 기본
4.background #D4F4FA:배경색 지정(RGB)
5.border-left 10px solid #1FAFDA:왼쪽 세로줄 굵기와 색상, 스타일
6.border-bottom 1px solid #1FAFDA:아래줄 굵기, 색상, 스타일
7.margin 1.5em 10px:인용구 시작위치 지정(em:글꼴 기준 상대적 크기 정의)
margin top right bottom left
8.padding:세로 높이와 세로선과 텍스트 사이 공백 지정, 지정순서는 margin과 동일

[ 참고 ]

1. loekohc - [CSS] 인용구 (blockquote) 스타일 변경
2. 블로마리 노트 - 인용문 태그 스타일 바꾸는 여러가지 방법
3. 폴리곤스튜디오 - 인용문구 만들기
4. ClearBoth - CSS 레이아웃 모델