안녕하세요. 다밍입니다.
오늘은 워드프레스 초간단 텍스트 상자 적용하기에 대해서 설명드리겠습니다.
아래 텍스트 박스 적용하고 싶으시다면 따로오시면 됩니당~
클래식편집기 기반으로 설명드릴꺼에요~
워드프레스 초간단 텍스트 상자 적용하기
CSS 추가하기(텍스트 상자)
워드프레스 관리페이지 -> 외모 -> 사용자정의하기 -> 추가CSS에 아래처럼 코드를 추가해 주면 됩니다.
코드는 아래 코드를 복사해서 쓰셔요.
/* 텍스트상자 */
.txtbox {
padding: 1.25em 1.125em;
border-radius: .750em;
background-color: #525960;
border-radius: 15px;
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.5);
padding: 20px;
margin: 20px 0;
color: white;
font-weight: bold;
}
문단에 코드 추가해주기
일단 글을 써주시구요
클래식 편집기의 오른쪽 위에 보이는 텍스트 탭으로 가주신 뒤 글 앞뒤로 코드를 추가해 주시면 됩니다.
아래처럼 코드를 변경해 주세요.
| <p class=”txtbox”>텍스트 박스 적용</p> |
위에서 적용한 css를 먹여준다고 생각하시면 되는거에요 ^^
그럼 끝! 딱 끝!!
너무 간단하죠??
그리고 옆에서 미리보기 눌러보시면 똬악 적용되는거 보실 수 있습니다.
플러그인 없이도 간단하게 적용 가능하구요, 색상이나 그런건 css검색을 좀 해보시면 좀 더 디테일 하게 바꾸실 수 있을껀데요.
워드프레스는 미적 감각에 너무 많은 시간을 쓰실 필요는 없지 않나 싶네요 ^^