본문 바로가기


IT 이야기/블로그팁

서식에 등록해두고 사용하는 이쁜 점선 테두리 박스 5가지 공개

by 낭만ii고양이 2018. 4. 28.








테스트 글자입니다 

테스트 글자입니다 



테스트 글자입니다 

테스트 글자입니다



테스트 글자입니다 

테스트 글자입니다 



테스트 글자입니다 

테스트 글자입니다 



테스트 글자입니다 

테스트 글자입니다 



블로그를 작성하다보면 글을 강조하기 위해서 특별한 테두리 박스가 필요한경우가 종종 발생합니다. 이런경우를 위해서 미리 테두리 박스를 만들어 놓고 있다가 필요할때 사용하면 좋을것입니다. 저같은경우는 위 5개의 박스를 서식에 등록해 놓고 필요할때 서식에서 불러서 사용하고 있습니다.필요없는 부분은 지우면 그만이니 편리하게 사용가능합니다. 





서식등록하는 방법은 관리자 메뉴에 들어가셔서 서식관리 클릭한후 서식쓰기 클릭 한다음 html 체크박스에 체크하신후 아래 소스를 복사한후 붙여넣기 합니다. 그다음 html 체크박스에 체크 해제해보시면 위와 같은 5개의 박스가 보일겁니다.확인하신후 제목을 입력하고 발행하기를 누르시면 됩니다.  서식을 불러오는 방법은 글쓰기 를 누른후 오른쪽 하단에 보시면 서식 이라는 메뉴가 있습니다.클릭하셔셔 등록한 서식 제목을 클릭하면 불러올수가 있습니다.



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<p><br /></p>
<p><br /></p>
 
<div style="
margin: 0px; padding: 10px;
color: rgb(102, 102, 102); border-width: 2px; 
border-style: dashed; border-color: rgb(200, 5, 106); 
background-color: rgb(252, 222, 236);">
 
<span style="color: rgb(0, 0, 0); font-size: 12pt;">
<p>테스트 글자입니다 </p>
<p>테스트 글자입니다 </p>
</span>
 
</div>
 
<p><br /></p>
<p><br /></p>
 
<div style="
color: rgb(51, 51, 51);  
border-width: 2px; border-style: dashed; 
border-color: rgb(121, 165, 228); 
padding: 10px; background-color: 
rgb(219, 232, 251);">
 
<span style="color: rgb(0, 0, 0); font-size: 12pt;">
<p>테스트 글자입니다 </p>
<p>테스트 글자입니다 </p>
</span>
 
</div>
 
<p><br /></p>
<p><br /></p>
 
<div style="
margin: 0px; padding: 10px; 
color: rgb(102, 102, 102);  
border-width: 2px; border-style: 
dashed; border-color: rgb(243, 197, 52); 
background-color: rgb(254, 254, 184);">
 
<span style="color: rgb(0, 0, 0); font-size: 12pt;">
<p>테스트 글자입니다 </p>
<p>테스트 글자입니다 </p>
</span>
 
</div>
 
<p><br /></p>
<p><br /></p>
 
<div style="
color: rgb(51, 51, 51);  
border-width: 2px; border-style: 
dashed; border-color: rgb(254, 137, 67); 
padding: 10px; 
background-color: rgb(254, 222, 199);">
 
<span style="color: rgb(0, 0, 0); font-size: 12pt;">
<p>테스트 글자입니다 </p>
<p>테스트 글자입니다 </p>
</span>
 
</div>
 
<p><br /></p>
<p><br /></p>
 
<div style="
border-width: 2px; 
border-style:  dashed; 
border-color: rgb(159, 211, 49); 
padding: 10px; 
background-color: rgb(231, 253, 181);">
 
<span style="color: rgb(0, 0, 0); font-size: 12pt;">
<p>테스트 글자입니다 </p>
<p>테스트 글자입니다 </p>
</span>
 
</div>
 
<p><br /></p>
<p><br /></p>
<p><br /></p>









제 글이 도움이 되셨다면  "공감 (♡)" 한번씩 클릭해주시고 응원의 댓글들도 남겨주세요.


 







댓글