이런 테이블? 은 어찌 만드나요?
가로로 이런 모양으로 3개를 넣고 싶은데 가능할까요?
텍스트도 그렇구 조언 봄 부탁드립니다.
답변 5개 / 댓글 3개
가로로 3개 넣고 싶으시다면
<div style="width:300px; height:390px; text-align:center; background:#0c3c60; float:left;">
<span style="font-size:14pt; color:#c9dcea">텍스트1</span><br>
<span style="font-size:12pt; color:#c9dcea">텍스트2</span><br>
</div>
<div style="width:300px; height:390px; text-align:center; background:#0c3c60; float:left;">
<span style="font-size:14pt; color:#c9dcea">텍스트1</span><br>
<span style="font-size:12pt; color:#c9dcea">텍스트2</span><br>
</div>
<div style="width:300px; height:390px; text-align:center; background:#0c3c60; float:left;">
<span style="font-size:14pt; color:#c9dcea">텍스트1</span><br>
<span style="font-size:12pt; color:#c9dcea">텍스트2</span><br>
</div>
<div style="clear:both"></div>
이런식으로 float:left 정렬 조건을 줍니다.
그리고 정렬 조건 이후 마지막엔 <div style="clear:both"></div> 이렇게 마무리 해주시구요
답변에 대한 댓글 1개
우선 기본적으로 css 의 이해가 우선인것 같습니다.
<div style="width:300px; height:390px; text-align:center; background:#0c3c60; float:left; margin-right:10px;">
<span style="font-size:14pt; color:#c9dcea">텍스트1</span><br>
<span style="font-size:12pt; color:#c9dcea">텍스트2</span><br>
</div>
<div style="width:300px; height:390px; text-align:center; background:#0c3c60; float:left; margin-right:10px;">
<span style="font-size:14pt; color:#c9dcea">텍스트1</span><br>
<span style="font-size:12pt; color:#c9dcea">텍스트2</span><br>
</div>
<div style="width:300px; height:390px; text-align:center; background:#0c3c60; float:left;">
<span style="font-size:14pt; color:#c9dcea">텍스트1</span><br>
<span style="font-size:12pt; color:#c9dcea">텍스트2</span><br>
</div>
<div style="clear:both"></div>
margin-right:10px;
이런식으로 오른쪽에 마진을 10px 주시면 여백을 주실 수 있습니다.
답변에 대한 댓글 1개
sinbiHTML https://www.homzzang.com/b/html (div, table 위주)
CSS https://www.homzzang.com/b/css (margin, padding, float 위주)
HTML CSS 2주 시간내서 전체를 꼼꼼히 공부하시면,
웬만한 레이아웃은 다 짜실 수 있을 겁니다.
양이 많지 않아서 빨리 공부면 3 ~ 5일 정도에 다 공부 가능합니다.
답변에 대한 댓글 1개
알려주신 방법으로 했더니
다닥 다닥 붙어서 나옵니다.
첫번째 이미지 처럼 저렇게 텍스트 및 테이블 간격을 주고 싶습니다.
조언 좀 부탁드려요. (__)
<div style="width:300px; height:390px; text-align:center; background:#0c3c60;">
<span style="font-size:14pt; color:#c9dcea">텍스트1</span><br>
<span style="font-size:12pt; color:#c9dcea">텍스트2</span><br>
</div>
간단하게는 이렇게 구현 가능합니다.
답변을 작성하려면 로그인이 필요합니다.
여백을 줄 수 있을까요?