혹시 옛날에 나모웹 에디터처럼
html을 예쁘게 만들 수 있는 에디터를 알고 계시는가요?
그누보드 안에 있는 에디터를 이용하려니 힘이 드네요.
그러면 혹시 죄송한데
표안에 있는 셀 <td> 의 좌측 우측 모두다 여백을 주는 방법 아시나요?
그것만 해결되면 끝날 것 같습니다.
|
답변 1개 / 댓글 3개
채택된 답변
+20 포인트
2023-06-21 (수) 19:38:39
조금 번거롭긴 하지만 아래와 같은 방법도 있을것 같습니다.
1. ${skin}/board/basic/style.css 또는 모든 페이지에서 사용되는 css 파일에 스타일 선언
Copy
table.__se_tbl_col {
border-collapse: collapse;
border-spacing: 0;
}
table.__se_tbl_sep {
border-collapse: separate;
border-spacing: 1em;
}
table.__se_tbl_common th, table.__se_tbl_common td {
border:1px solid #cccccc;
background-color: #fff;
width: 100px;
}2. 에디터에서 HTML 모드로 태그입력
Copy
<table class="__se_tbl_col __se_tbl_common">
<tbody>
<tr><td><p> </p></td>
<td><p> </p></td>
<td><p> </p></td>
<td><p> </p></td>
</tr>
<tr><td><p> </p></td>
<td><p> </p></td>
<td><p> </p></td>
<td><p> </p></td>
</tr>
</tbody>
</table>
<table class="__se_tbl_sep __se_tbl_common">
<tbody>
<tr><td><p> </p></td>
<td><p> </p></td>
<td><p> </p></td>
<td><p> </p></td>
</tr>
<tr><td><p> </p></td>
<td><p> </p></td>
<td><p> </p></td>
<td><p> </p></td>
</tr>
</tbody>
</table>답변에 대한 댓글 3개
김태현Tabby
2023-06-21 (수) 19:55:25
2023-06-21 (수) 20:05:31
td 끼리의 여백으로 잘못 이해한것 같습니다.
td 내부 여백이라면 padding 이나 필요에 따라 align 속성 추가, 다음처럼 될것 같습니다.
[code]
table.__se_tbl_common th, table.__se_tbl_common td {
border:1px solid #cccccc;
background-color: #fff;
width: 100px;
padding: 10px;
text-align: center;
}
[/code]
td 내부 여백이라면 padding 이나 필요에 따라 align 속성 추가, 다음처럼 될것 같습니다.
[code]
table.__se_tbl_common th, table.__se_tbl_common td {
border:1px solid #cccccc;
background-color: #fff;
width: 100px;
padding: 10px;
text-align: center;
}
[/code]
김태현Tabby
2023-06-21 (수) 21:30:02
그냥 css 가 적용되는 내용관리여서 곧바로 위와같이 <td style="padding:0 0 0 0;"> 내용 </td> 으로 처리했습니다. 그러나 채택드리겠습니다. 감사합니다.
답변을 작성하려면 로그인이 필요합니다.
아래와 같이 하면 될까요?
<td style="padding:0 0 0 0;"> 내용 </td>
padding:0 0 0 0;
순서대로.. 0 0 0 0 설명-
상단에서의 여백, 우측에서의 여백, 하단에서의 여백, 좌측에서의 여백
시계가 돌아가는 방향으로 12시(상) 3시(우) 6시(하) 9시(좌) 으로 여백이 생긴다고 생각하세요.
예) <td style="padding:0 0 0 50px;"> 내용 </td> 이라면 촤측으로 50의 여백이 생겨 '내용'이 우측으로 50픽셀 만큼 밀려납니다.
예) <td style="padding:10px 10px 10px 10px;"> 내용 </td> 이라면 (상) (우) (하) (좌) 에 10픽셀씩 여백이 생깁니다.