Re: Re: Re: Re: Re: 도움 요청합니다(테이블 배경과 테두리에 색 사용)

[제선]

수고하셨습니다.
테이블이라는 기본 틀에 필요한 내용(텍스트, 이미지, 동영상 등)을 넣는 것이니 

- 우선은 테이블을 확실하게 만들어야 겠지요.
테이블은 기본적으로
테이블의 시작을 알리는 열림태그(<table><tr><td>)로 시작하여 반드시 
게시물 내용들을 입력한 후에는 끝 부분에 
테이블의 끝을 나타 내는 닫힘태그(</td></tr></table>)로 끝내야 합니다.
즉 테이블의 내용이 미치는 경계를 확정해 주는 것이지요.
닫힘태그가 잘못되면 테이블 내용의 소스 영역이 게시판의 다른 영역(댓글 칸 목록 칸 등)에도 미치어
게시판의 구조에 이상이 생기게 됩니다.

그래서 게시물에 사용된 열림태그 셋트의 수만큼 닫힘태그 셋트의 수도 같아야 합니다.
즉 짝을 이루어야 하지요.
(항상 게시물 작성 후 열림태그의 역순으로 닫힘태그가 입력됐는지를 확인해 보세요)
 
그렇치 않으면 게시물의 출력 시 게시물이나 게시판에 오류가 생깁니다.
제시하신 게시물의 경우도 테이블 영역이 끝났음을 알리는 
닫힘태그 셋트(</td></tr></table>)가 누락되어 댓글을 달 수  없는 상태가 된 것입니다.

<table><tr><td>

텍스트나 이미지, 동영상 등 소스 입력

</td></tr></table>

또는 (아래로 나열해도 상관없습니다)
<table>
<tr>
<td>

텍스트나 이미지, 동영상 등 소스 입력

</td>
</tr>
</table>

위와 같이 테이블 소스가 완성되면
그 안에 내용물(텍스트, 이미지, 동영상 등)에 필요한 소스를 입력하면 됩니다.

- 텍스트나 이미지 또는 동영상 간의 줄 바꿈은 이전에 설명한 대로 pre 태그나 br 태그를 
  기본적으로 사용하면 됩니다.
  이 외에도 p 또는 div 등 줄바꿈 같은 역할도 하는 태그를 사용할 수도 있으나 여기선 
  설명을 생략합니다.

- 텍스트 입력 시 "글자 크기, 글 꼴,  글자 색, 줄 간격" 등은 개별적으로 지정해도 됩니다.
  여기서도 style 태그를 사용하는 방법을 알려 드리지요
  (가능한 style 태그를 사용하는 방법을 익히시는 것이 앞으로 모든 게시물 작성에 도움이 됩니다)
  
기본 사용 : 아래의 style 태그를 font 태그 속에 넣어 텍스트 시작 부분 앞에 넣어 사용합니다.
사용 예 <font style="font-size: 12pt; font-family: 궁서; color: blue; line-height: 1.5; font-weight: bold;">
각 속성(font-size, font-family, color, line-heigh, font-weight)과 속성 값(12p, 궁서, blue, 1.5, bold)을 설명하면
font-size 는 글자 크기를 지정하는 것으로 값은 수치로 표시하며 단위는 여러 가지 있으나 pt를 주로 사용합니다.
font-family 는 글꼴을 지정하는 것으로 한글 문서의 글꼴 등을 참조하면 됩니다.
color는 글자 색을 지정하는 것으로 헥사값(#0000ff, #00ff00 등)이나 색 이름(red, green 등)으로 표시하면 되고,
line-height는 텍스트의 줄 간격을 지정하는 것으로 수치(1, 1.2, 1.5, 2 등), %(100%, 120%, 150% 등), px(10px, 15px, 20px 등)으로 표시할 수 있습니다.
font-weight는 글자색을 진하게 지정하는 것으로 400. 600, 800 등의 수치나 bold 로 표시할 수 있으며 600이면 bold 와 같은 진한 색이 됩니다.
(보통 글자색을 진하게 하려고 글자 앞에 <b>를 넣고 끝에 </b>를 사용하는 데  font-weight: bold 값이 같은 역할을 하지요)

위에 열거한 텍스트에 대한 속성과 값은 종합적으로 열거한 것이니 게시물 작성 시는 필요한 부분만 사용하시며 순서는 관계없습니다.
※ 주의 사항 : style 태그에서는 각 속성과 속성 값 사이는 콜론(:)으로, 각각의 속성들의 구분은 세미콜론(;)으로 표시하여야 합니다.

- 이미지 태그의 기본은 아래와 같습니다.(아래의 이미지 태그 소스를 텍스트의 한 줄로 생각하고 필요한 위치에 넣어 사용하면 됩니다)
<img src="이미지 주소" width="폭" height="높이">
(원본 이미지의 폭과 높이의 비율을 유지하면서 크기를 크게 또는 작게 출력할 때는 heigh는 생략해도 됩니다)

[제선]

테이블과 택스트 관련 태그라는 것을 간단히 설명하기에는 어려움이 많습니다.
우선은 기본 적으로 사용할 수 있는 부분만 열거하였습니다.

사용환경에 따라 간편한 방법도 있고, 달라지는 경우도 있습니다.

여기 설명한 것은 다음 카페 게시판의 경우를 중심으로 한 것입니다.
자주 작성하면서 생기는 문제점에서 익혀 가시면 될 것 같습니다.

태그도 사용자에 따라 다른 점이 있느니 위 내용이 절대적일 수는 없음을 참고하세요.

아래는 예제이니 참고해 보세요.(클릭)
https://t1.daumcdn.net/cafeattach/1ZFir/717e53f5319d18fdc1f84a1661af52cf9bfb25da