원하는 부분에 글자 글씨 넣기 워드프레스 블로그 꾸미기 CSS 수정

CSS 수정으로 어떠한 테마든 내 블로그에 추가로 글자(글씨)를 넣을 수 있습니다.

그럼 어떻게 CSS 수정을 통해서 원하는 곳에 글자를 넣을 수 있는지 알아보겠습니다.

워드프레스에서 CSS 추가하는 방법은 아래 링크를 참고해주세요.

오늘 작업할 내용 (원하는 곳에 글자 추가하기)

위 이미지는 네모 부분 안에 문장을 아래 푸터(footer)에 추가로 작성한 모습입니다.

오늘 배우는 방법으로 원하는 부분에 글자를 추가 할 수 있습니다.

마우스를 수정하고자 하는 부분에 마우스를 대고 해당 부분을 정의하는 이름을 찾을 수 있습니다.

수정할 부분의 이름은 ‘.site-info’ 인 것이 확인됩니다.

.site-info:before {
	content: "원하는 내용 \a 넣기.";
	white-space:pre;
}

위에 코드를 복사 붙여넣기 하여 적용해도 됩니다. (다만 푸터(footer) 부분 지정된 이름이 다를 수 있으니 이전에 이름 확인한 후 진행해주세요.)

.site-info > 수정할 부분의 이름을 먼저 작성합니다.

:before > 지정된 부분 전에 입력하는 내용이 나오도록 합니다. EX) 1. 새로 추가되는 부분 / 2. 지정부분

위와 반대로 :after 는 지정된 부분 후에 내용이 나오도록 합니다. EX) 1. 지정부분/ 2. 새로 추가되는 부분

content: “추가할 문장 넣기”; > 추가하고 싶은 글자를 넣어 주시면 됩니다. ( 줄 바꿈은 “\a”로 할 수 있습니다.)

white-space: pre; > 이 코드를 넣어야 위에 넣은 줄바꿈이 적용 됩니다.

관련글