이제 표의 셀 색이나..표의 선색을 한번 알아보도록 하져~! 우선 어떤 셀색을
지정할때는..bgcolor를 씁니다. color명은...영어로 써주시던가..아니면 색상표의 RGB코드값을 넣어주시면
됩니다.
형식은..bgcolor=green 또는 bgcolor=#156B0F 이런식입니다.
그럼 아래와 같이 해보져~!!
| Tag
|
<![CDATA[<html>
<head>
<script type="text/javascript">if (!window.T) { window.T = {} }
window.T.config = {"TOP_SSL_URL":"https://www.tistory.com","PREVIEW":false,"ROLE":"guest","PREV_PAGE":"","NEXT_PAGE":"","BLOG":{"id":5625759,"name":"pshto","title":"Happy Everyday","isDormancy":false,"nickName":"쿠욱키","status":"open","profileStatus":"normal"},"NEED_COMMENT_LOGIN":false,"COMMENT_LOGIN_CONFIRM_MESSAGE":"","LOGIN_URL":"https://www.tistory.com/auth/login/?redirectUrl=https://pshto.tistory.com/4875337","DEFAULT_URL":"https://pshto.tistory.com","USER":{"name":null,"homepage":null,"id":0,"profileImage":null},"SUBSCRIPTION":{"status":"none","isConnected":false,"isPending":false,"isWait":false,"isProcessing":false,"isNone":true},"IS_LOGIN":false,"HAS_BLOG":false,"IS_SUPPORT":false,"IS_SCRAPABLE":false,"TOP_URL":"http://www.tistory.com","JOIN_URL":"https://www.tistory.com/member/join","PHASE":"prod","ROLE_GROUP":"visitor"};
window.T.entryInfo = {"entryId":4875337,"isAuthor":false,"categoryId":1191931,"categoryLabel":"태그에 대해서 한번 배워볼까요?"};
window.appInfo = {"domain":"tistory.com","topUrl":"https://www.tistory.com","loginUrl":"https://www.tistory.com/auth/login","logoutUrl":"https://www.tistory.com/auth/logout"};
window.initData = {};
window.TistoryBlog = {
basePath: "",
url: "https://pshto.tistory.com",
tistoryUrl: "https://pshto.tistory.com",
manageUrl: "https://pshto.tistory.com/manage",
token: "GCxN4WrY/mp22hBcKzJEYxCWpzWVt/AaysTJ8NpAvlgCeB2ux1wn1KoIhgzOygYI"
};
var servicePath = "";
var blogURL = "";</script>
<title>표의 셀색</title>
<style type="text/css">.another_category {
border: 1px solid #E5E5E5;
padding: 10px 10px 5px;
margin: 10px 0;
clear: both;
}
.another_category h4 {
font-size: 12px !important;
margin: 0 !important;
border-bottom: 1px solid #E5E5E5 !important;
padding: 2px 0 6px !important;
}
.another_category h4 a {
font-weight: bold !important;
}
.another_category table {
table-layout: fixed;
border-collapse: collapse;
width: 100% !important;
margin-top: 10px !important;
}
* html .another_category table {
width: auto !important;
}
*:first-child + html .another_category table {
width: auto !important;
}
.another_category th, .another_category td {
padding: 0 0 4px !important;
}
.another_category th {
text-align: left;
font-size: 12px !important;
font-weight: normal;
word-break: break-all;
overflow: hidden;
line-height: 1.5;
}
.another_category td {
text-align: right;
width: 80px;
font-size: 11px;
}
.another_category th a {
font-weight: normal;
text-decoration: none;
border: none !important;
}
.another_category th a.current {
font-weight: bold;
text-decoration: none !important;
border-bottom: 1px solid !important;
}
.another_category th span {
font-weight: normal;
text-decoration: none;
font: 10px Tahoma, Sans-serif;
border: none !important;
}
.another_category_color_gray, .another_category_color_gray h4 {
border-color: #E5E5E5 !important;
}
.another_category_color_gray * {
color: #909090 !important;
}
.another_category_color_gray th a.current {
border-color: #909090 !important;
}
.another_category_color_gray h4, .another_category_color_gray h4 a {
color: #737373 !important;
}
.another_category_color_red, .another_category_color_red h4 {
border-color: #F6D4D3 !important;
}
.another_category_color_red * {
color: #E86869 !important;
}
.another_category_color_red th a.current {
border-color: #E86869 !important;
}
.another_category_color_red h4, .another_category_color_red h4 a {
color: #ED0908 !important;
}
.another_category_color_green, .another_category_color_green h4 {
border-color: #CCE7C8 !important;
}
.another_category_color_green * {
color: #64C05B !important;
}
.another_category_color_green th a.current {
border-color: #64C05B !important;
}
.another_category_color_green h4, .another_category_color_green h4 a {
color: #3EA731 !important;
}
.another_category_color_blue, .another_category_color_blue h4 {
border-color: #C8DAF2 !important;
}
.another_category_color_blue * {
color: #477FD6 !important;
}
.another_category_color_blue th a.current {
border-color: #477FD6 !important;
}
.another_category_color_blue h4, .another_category_color_blue h4 a {
color: #1960CA !important;
}
.another_category_color_violet, .another_category_color_violet h4 {
border-color: #E1CEEC !important;
}
.another_category_color_violet * {
color: #9D64C5 !important;
}
.another_category_color_violet th a.current {
border-color: #9D64C5 !important;
}
.another_category_color_violet h4, .another_category_color_violet h4 a {
color: #7E2CB5 !important;
}
</style>
<link rel="stylesheet" type="text/css" href="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-02ff336bcf009d919d5b5155613b09894a859e40/static/style/revenue.css"/>
<link rel="canonical" href="https://pshto.tistory.com/4875337"/>
<!-- BEGIN STRUCTURED_DATA -->
<script type="application/ld+json">
{"@context":"http://schema.org","@type":"BlogPosting","mainEntityOfPage":{"@id":"https://pshto.tistory.com/4875337","name":null},"url":"https://pshto.tistory.com/4875337","headline":"표에 색","description":" 이제 표의 셀 색이나..표의 선색을 한번 알아보도록 하져~! 우선 어떤 셀색을 지정할때는..bgcolor를 씁니다. color명은...영어로 써주시던가..아니면 색상표의 RGB코드값을 넣어주시면 됩니다. 형식은..bgcolor=green 또는 bgcolor=#156B0F 이런식입니다. 그럼 아래와 같이 해보져~!! Tag 표의 셀색 표만들기 해보세요 ..","author":{"@type":"Person","name":"쿠욱키","logo":null},"image":{"@type":"ImageObject","url":"https://img1.daumcdn.net/thumb/R800x0/?scode=mtistory2&fname=https%3A%2F%2Ft1.daumcdn.net%2Ftistory_admin%2Fstatic%2Fimages%2FopenGraph%2Fopengraph.png","width":"800px","height":"800px"},"datePublished":"2005-10-29T18:27:25+09:00","dateModified":"2005-10-29T18:27:25+09:00","publisher":{"@type":"Organization","name":"TISTORY","logo":{"@type":"ImageObject","url":"https://t1.daumcdn.net/tistory_admin/static/images/openGraph/opengraph.png","width":"800px","height":"800px"}}}
</script>
<!-- END STRUCTURED_DATA -->
<link rel="stylesheet" type="text/css" href="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-02ff336bcf009d919d5b5155613b09894a859e40/static/style/dialog.css"/>
<link rel="stylesheet" type="text/css" href="//t1.daumcdn.net/tistory_admin/www/style/top/font.css"/>
<link rel="stylesheet" type="text/css" href="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-02ff336bcf009d919d5b5155613b09894a859e40/static/style/postBtn.css"/>
<link rel="stylesheet" type="text/css" href="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-02ff336bcf009d919d5b5155613b09894a859e40/static/style/tistory.css"/>
<script type="text/javascript" src="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-02ff336bcf009d919d5b5155613b09894a859e40/static/script/common.js"></script>
</head>
<body>
<table border=1 bgcolor=yellow>
<tr>
<td>표<td>만</td><td>들</td><td>기</td>
<tr>
<td>해</td><td>보</td><td>세</td><td>요</td>
</table>
<div style="margin:0; padding:0; border:none; background:none; float:none; clear:none; z-index:0"></div>
<script type="text/javascript" src="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-02ff336bcf009d919d5b5155613b09894a859e40/static/script/common.js"></script>
<script type="text/javascript">window.roosevelt_params_queue = window.roosevelt_params_queue || [{channel_id: 'dk', channel_label: '{tistory}'}]</script>
<script type="text/javascript" src="//t1.daumcdn.net/midas/rt/dk_bt/roosevelt_dk_bt.js" async="async"></script>
<script>window.tiara = {"svcDomain":"user.tistory.com","section":"글뷰","trackPage":"글뷰_보기","page":"글뷰","key":"5625759-4875337","customProps":{"userId":"0","blogId":"5625759","entryId":"4875337","role":"guest","trackPage":"글뷰_보기","filterTarget":false},"entry":{"entryId":"4875337","entryTitle":"표에 색","entryType":"POST","categoryName":"태그에 대해서 한번 배워볼까요?","categoryId":"1191931","serviceCategoryName":null,"serviceCategoryId":null,"author":"5530530","authorNickname":"쿠욱키","blogNmae":"Happy Everyday","image":"","plink":"/4875337","tags":[]},"kakaoAppKey":"3e6ddd834b023f24221217e370daed18","appUserId":"null"}</script>
<script type="module" src="https://t1.daumcdn.net/tistory_admin/frontend/tiara/v1.0.5/index.js"></script>
<script src="https://t1.daumcdn.net/tistory_admin/frontend/tiara/v1.0.5/polyfills-legacy.js" nomodule="true" defer="true"></script>
<script src="https://t1.daumcdn.net/tistory_admin/frontend/tiara/v1.0.5/index-legacy.js" nomodule="true" defer="true"></script>
</body>
</html>
]]>
|
| 실행결과
|
|
|
bgcolor는 배경의 색이져~!! 표 자체에 색이 들어갔습니다. 이유는 table 옆에
bgcolor=yellow 를 넣어줬기 때문에 그렇습니다. bgcolor=yellow를 <td>안에 써주면
어떻게 될까여?? 네 맞습니다. 그럼 하나하나 셀의 배경색이 바뀌게 되겠죠...아래와 같이... 색은...사용자가 지정하기따라
틀립니다.
위에 표는 각각 셀색을 틀리게 한 경우입니다.
그럼..아래 예제대로 한번 해보져~!!
| Tag
|
<![CDATA[<html>
<head>
<script type="text/javascript">if (!window.T) { window.T = {} }
window.T.config = {"TOP_SSL_URL":"https://www.tistory.com","PREVIEW":false,"ROLE":"guest","PREV_PAGE":"","NEXT_PAGE":"","BLOG":{"id":5625759,"name":"pshto","title":"Happy Everyday","isDormancy":false,"nickName":"쿠욱키","status":"open","profileStatus":"normal"},"NEED_COMMENT_LOGIN":false,"COMMENT_LOGIN_CONFIRM_MESSAGE":"","LOGIN_URL":"https://www.tistory.com/auth/login/?redirectUrl=https://pshto.tistory.com/4875337","DEFAULT_URL":"https://pshto.tistory.com","USER":{"name":null,"homepage":null,"id":0,"profileImage":null},"SUBSCRIPTION":{"status":"none","isConnected":false,"isPending":false,"isWait":false,"isProcessing":false,"isNone":true},"IS_LOGIN":false,"HAS_BLOG":false,"IS_SUPPORT":false,"IS_SCRAPABLE":false,"TOP_URL":"http://www.tistory.com","JOIN_URL":"https://www.tistory.com/member/join","PHASE":"prod","ROLE_GROUP":"visitor"};
window.T.entryInfo = {"entryId":4875337,"isAuthor":false,"categoryId":1191931,"categoryLabel":"태그에 대해서 한번 배워볼까요?"};
window.appInfo = {"domain":"tistory.com","topUrl":"https://www.tistory.com","loginUrl":"https://www.tistory.com/auth/login","logoutUrl":"https://www.tistory.com/auth/logout"};
window.initData = {};
window.TistoryBlog = {
basePath: "",
url: "https://pshto.tistory.com",
tistoryUrl: "https://pshto.tistory.com",
manageUrl: "https://pshto.tistory.com/manage",
token: "GCxN4WrY/mp22hBcKzJEYxCWpzWVt/AaysTJ8NpAvlgCeB2ux1wn1KoIhgzOygYI"
};
var servicePath = "";
var blogURL = "";</script>
<title>표의 셀색</title>
<style type="text/css">.another_category {
border: 1px solid #E5E5E5;
padding: 10px 10px 5px;
margin: 10px 0;
clear: both;
}
.another_category h4 {
font-size: 12px !important;
margin: 0 !important;
border-bottom: 1px solid #E5E5E5 !important;
padding: 2px 0 6px !important;
}
.another_category h4 a {
font-weight: bold !important;
}
.another_category table {
table-layout: fixed;
border-collapse: collapse;
width: 100% !important;
margin-top: 10px !important;
}
* html .another_category table {
width: auto !important;
}
*:first-child + html .another_category table {
width: auto !important;
}
.another_category th, .another_category td {
padding: 0 0 4px !important;
}
.another_category th {
text-align: left;
font-size: 12px !important;
font-weight: normal;
word-break: break-all;
overflow: hidden;
line-height: 1.5;
}
.another_category td {
text-align: right;
width: 80px;
font-size: 11px;
}
.another_category th a {
font-weight: normal;
text-decoration: none;
border: none !important;
}
.another_category th a.current {
font-weight: bold;
text-decoration: none !important;
border-bottom: 1px solid !important;
}
.another_category th span {
font-weight: normal;
text-decoration: none;
font: 10px Tahoma, Sans-serif;
border: none !important;
}
.another_category_color_gray, .another_category_color_gray h4 {
border-color: #E5E5E5 !important;
}
.another_category_color_gray * {
color: #909090 !important;
}
.another_category_color_gray th a.current {
border-color: #909090 !important;
}
.another_category_color_gray h4, .another_category_color_gray h4 a {
color: #737373 !important;
}
.another_category_color_red, .another_category_color_red h4 {
border-color: #F6D4D3 !important;
}
.another_category_color_red * {
color: #E86869 !important;
}
.another_category_color_red th a.current {
border-color: #E86869 !important;
}
.another_category_color_red h4, .another_category_color_red h4 a {
color: #ED0908 !important;
}
.another_category_color_green, .another_category_color_green h4 {
border-color: #CCE7C8 !important;
}
.another_category_color_green * {
color: #64C05B !important;
}
.another_category_color_green th a.current {
border-color: #64C05B !important;
}
.another_category_color_green h4, .another_category_color_green h4 a {
color: #3EA731 !important;
}
.another_category_color_blue, .another_category_color_blue h4 {
border-color: #C8DAF2 !important;
}
.another_category_color_blue * {
color: #477FD6 !important;
}
.another_category_color_blue th a.current {
border-color: #477FD6 !important;
}
.another_category_color_blue h4, .another_category_color_blue h4 a {
color: #1960CA !important;
}
.another_category_color_violet, .another_category_color_violet h4 {
border-color: #E1CEEC !important;
}
.another_category_color_violet * {
color: #9D64C5 !important;
}
.another_category_color_violet th a.current {
border-color: #9D64C5 !important;
}
.another_category_color_violet h4, .another_category_color_violet h4 a {
color: #7E2CB5 !important;
}
</style>
<link rel="stylesheet" type="text/css" href="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-02ff336bcf009d919d5b5155613b09894a859e40/static/style/revenue.css"/>
<link rel="canonical" href="https://pshto.tistory.com/4875337"/>
<!-- BEGIN STRUCTURED_DATA -->
<script type="application/ld+json">
{"@context":"http://schema.org","@type":"BlogPosting","mainEntityOfPage":{"@id":"https://pshto.tistory.com/4875337","name":null},"url":"https://pshto.tistory.com/4875337","headline":"표에 색","description":" 이제 표의 셀 색이나..표의 선색을 한번 알아보도록 하져~! 우선 어떤 셀색을 지정할때는..bgcolor를 씁니다. color명은...영어로 써주시던가..아니면 색상표의 RGB코드값을 넣어주시면 됩니다. 형식은..bgcolor=green 또는 bgcolor=#156B0F 이런식입니다. 그럼 아래와 같이 해보져~!! Tag 표의 셀색 표만들기 해보세요 ..","author":{"@type":"Person","name":"쿠욱키","logo":null},"image":{"@type":"ImageObject","url":"https://img1.daumcdn.net/thumb/R800x0/?scode=mtistory2&fname=https%3A%2F%2Ft1.daumcdn.net%2Ftistory_admin%2Fstatic%2Fimages%2FopenGraph%2Fopengraph.png","width":"800px","height":"800px"},"datePublished":"2005-10-29T18:27:25+09:00","dateModified":"2005-10-29T18:27:25+09:00","publisher":{"@type":"Organization","name":"TISTORY","logo":{"@type":"ImageObject","url":"https://t1.daumcdn.net/tistory_admin/static/images/openGraph/opengraph.png","width":"800px","height":"800px"}}}
</script>
<!-- END STRUCTURED_DATA -->
<link rel="stylesheet" type="text/css" href="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-02ff336bcf009d919d5b5155613b09894a859e40/static/style/dialog.css"/>
<link rel="stylesheet" type="text/css" href="//t1.daumcdn.net/tistory_admin/www/style/top/font.css"/>
<link rel="stylesheet" type="text/css" href="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-02ff336bcf009d919d5b5155613b09894a859e40/static/style/postBtn.css"/>
<link rel="stylesheet" type="text/css" href="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-02ff336bcf009d919d5b5155613b09894a859e40/static/style/tistory.css"/>
<script type="text/javascript" src="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-02ff336bcf009d919d5b5155613b09894a859e40/static/script/common.js"></script>
</head>
<body>
<center><font size=5 color= #3939AE>■ 명시 LIST ■</font><br>
<table border=1>
<tr>
<td bgcolor=#FFEBD8>일련 번호</td>
<Td bgcolor=#FFEBD8>제 목</td>
<td bgcolor=#FFEBD8>작 가</td>
<tr>
<td bgcolor=ivory>1</td>
<Td bgcolor=#AFCCCE>너를 기다리는 동안</td>
<td bgcolor=#AFCCCE>황지우</td>
<tr>
<td bgcolor=ivory>2</td>
<Td bgcolor=#AFCCCE>그대가 곁에 있어도 나는 그대가 그립다.</td>
<td bgcolor=#AFCCCE>류시화</td>
<tr>
<td bgcolor=ivory>3</td>
<Td bgcolor=#AFCCCE>별 헤는 밤</td>
<td bgcolor=#AFCCCE>윤동주</td>
<tr>
<td bgcolor=ivory>4</td>
<Td bgcolor=#AFCCCE>이름없는 여인이 되어</td>
<td bgcolor=#AFCCCE>노천명</td>
</table>
<div style="margin:0; padding:0; border:none; background:none; float:none; clear:none; z-index:0"></div>
<script type="text/javascript" src="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-02ff336bcf009d919d5b5155613b09894a859e40/static/script/common.js"></script>
<script type="text/javascript">window.roosevelt_params_queue = window.roosevelt_params_queue || [{channel_id: 'dk', channel_label: '{tistory}'}]</script>
<script type="text/javascript" src="//t1.daumcdn.net/midas/rt/dk_bt/roosevelt_dk_bt.js" async="async"></script>
<script>window.tiara = {"svcDomain":"user.tistory.com","section":"글뷰","trackPage":"글뷰_보기","page":"글뷰","key":"5625759-4875337","customProps":{"userId":"0","blogId":"5625759","entryId":"4875337","role":"guest","trackPage":"글뷰_보기","filterTarget":false},"entry":{"entryId":"4875337","entryTitle":"표에 색","entryType":"POST","categoryName":"태그에 대해서 한번 배워볼까요?","categoryId":"1191931","serviceCategoryName":null,"serviceCategoryId":null,"author":"5530530","authorNickname":"쿠욱키","blogNmae":"Happy Everyday","image":"","plink":"/4875337","tags":[]},"kakaoAppKey":"3e6ddd834b023f24221217e370daed18","appUserId":"null"}</script>
<script type="module" src="https://t1.daumcdn.net/tistory_admin/frontend/tiara/v1.0.5/index.js"></script>
<script src="https://t1.daumcdn.net/tistory_admin/frontend/tiara/v1.0.5/polyfills-legacy.js" nomodule="true" defer="true"></script>
<script src="https://t1.daumcdn.net/tistory_admin/frontend/tiara/v1.0.5/index-legacy.js" nomodule="true" defer="true"></script>
</body>
</html>
]]>
|
| 실행결과
|
■ 명시 LIST ■
| 일련 번호 |
제 목 |
작 가 |
| 1 |
너를 기다리는 동안 |
황지우 |
| 2 |
그대가 곁에 있어도 나는 그대가 그립다. |
류시화 |
| 3 |
별 헤는 밤 |
윤동주 |
| 4 |
이름없는 여인이 되어 |
노천명 |
|
셀에
색을 넣는것은 확실히 이해가시져??? 위에 예제를 보니까..표안에..모든 글씨들이.. 전부...기본정렬(왼쪽)로 되어 있네여.... 각
셀마다..중간 정렬도 할수 있져~!! ^^;; 그냥 별도의 태그 셀 안에..<center>를 넣어 주셔도 되고..아니면
TD안에 align=center을 써 주셔도 됩니다...
|
Tag
| 결과
|
<![CDATA[<table border=1>
<tr>
<Td>
<center>우리나라 명시</center>
</table>
]]>
|
|
<![CDATA[<table border=1>
<tr>
<Td align=center>
우리나라 명시</td>
</table>
]]>
|
|
결과는 똑같이 나옵니다.
<center>글씨</center>를 쓰시던 아니면 <td align=center> 글씨
<td> 를 쓰시던 상관 없다는 소리져~!! 편하신걸로 쓰세여...^^;; 위에 내용을 가운데 정렬한 결과
입니다.
■ 명시 LIST ■
| 일련 번호 |
제 목 |
작 가 |
| 1 |
너를 기다리는 동안 |
황지우 |
| 2 |
그대가 곁에 있어도 나는 그대가 그립다. |
류시화 |
| 3 |
별 헤는 밤 |
윤동주 |
| 4 |
이름없는 여인이 되어 |
노천명 |
|
위와
같이 고쳐보세여..^^;;
|
