코스모스팜 스레드
테이블 만들고 있는데 글씨에 색을 넣고 싶습니다
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
table {
width: 100%;
border: 1px solid #444444;
border-collapse: collapse;
}
th, td {
border: 1px solid #444444;
padding: 10px;
}
</style>
</head>
<body>
<table>
<th></th>
<th bgcolor="#ffb5b5">Machinery</th>
<th bgcolor="#ffb5b5">Size</th>
<th bgcolor="#ffb5b5">Quantity</th>
<th bgcolor="#ffb5b5">Output (Month)</th>
<th bgcolor="#ffb5b5">Output (Year)</th>
<tr align="center">
<td rowspan="8">Main Factory</td>
<td>Plastic Extrusin Yarn</td>
<td>120-1250mm</td>
<td>1 line</td>
<td>200 tons</td>
<td>2,400 tons</td>
</tr>
<tr align="center">
<td rowspan="4">Weaving Machine (Water Jet)</td>
<td>SS-HL-2100</td>
<td>1 set</td>
<td>9 tons</td>
<td>108 tons</td>
</tr>
<tr align="center">
<td>SS-HL-2200</td>
<td>10 set</td>
<td>90 tons</td>
<td>1,080 tons</td>
</tr>
<tr align="center">
<td>SS-HL-2300</td>
<td>6 set</td>
<td>54 tons</td>
<td>648 tons</td>
</tr>
<tr align="center">
<td>SS-HL-2500</td>
<td>2 set</td>
<td>18 tons</td>
<td>216 tons</td>
</tr>
<tr align="center">
<td>Laminating Machine (Two side Laminateing)</td>
<td>150-2500L (Two Side Laminating and Corona)</td>
<td>1 line</td>
<td>900 tons</td>
<td>10,800 tons</td>
</tr>
<tr align="center">
<td rowspan="2">Re-winder</td>
<td>2100L</td>
<td>1 line</td>
<td>15 tons</td>
<td>180 tons</td>
</tr>
<tr align="center">
<td>2200L</td>
<td>1 line</td>
<td colspan="2"></td>
</tr>
<tr align="center">
<td rowspan="4">2nd Factory</td>
<td>Plastic Extrusion Yarn</td>
<td>110-1250 mm</td>
<td>1 line</td>
<td>180 tons</td>
<td>2,160 tons</td>
</tr>
<tr align="center">
<td rowspan="3">Weaving Machine (Water Jet)</td>
<td>SS-HL-2100</td>
<td>4 set</td>
<td>36 tons</td>
<td>432 tons</td>
</tr>
<tr align="center">
<td>SS-HL-2200</td>
<td>9 set</td>
<td>81 tons</td>
<td>972 tons</td>
</tr>
<tr align="center">
<td>SS-HL-2600</td>
<td>1 set</td>
<td>9 tons</td>
<td>108 tons</td>
</tr>
</table>
</table>
</body>
</html>
-
스레드봇 (31056 Point)ㆍ2019.10.14 13:48
아래와 같은 코드는 직접 추가하신 건지요?
table tr th:first-child, table tr td:first-child { padding-left: 0; color: #82c121; font-weight: bold; font-size: 1.4em; width: 150px; }같은 태그에 서로 다른 CSS 속성을 적용해야 하는 경우라면
HTML 태그에 직접 스타일을 주는 건 권장드리지 않습니다.
CSS ID 선택자 또는 클래스 선택자를 활용해보시겠어요?
CSS 선택자에 대한 자세한 내용은
아래의 링크를 참고해보세요.
https://www.w3schools.com/cssref/css_selectors.asp
고맙습니다.
-
design_gooner (112 Point)ㆍ2019.10.14 11:33
http://inhyukgo.cafe24.com/%ed%9a%8c%ec%82%ac%ec%97%b0%ed%98%81/
알려주신데로 해서 페이지를 열어보면 정상적으로 보이는데
홈페이지에 적용하면 이렇게 나와버리네요
기존에 css table 관련해서 적용한 부분때문에 그런거같은데 손을 못건드리겟습니다.
한번 봐주시겠어요? -
스레드봇 (31056 Point)ㆍ2019.10.14 11:12
안녕하세요.
Main Factory, 2nd Factory 부분을 굵게 표시하시려면
올려주신 코드 중
아래의 코드를 찾아서
<td rowspan="8">Main Factory</td>아래의 코드로 교체해보세요.
<td rowspan="8" style="font-weight: bold">Main Factory</td>아래의 코드를 찾아서
<td rowspan="4">2nd Factory</td>아래의 코드로 교체해보세요.
<td rowspan="4" style="font-weight: bold;">2nd Factory</td>Plastic Extrusin Yarn, Weaving Machine (Water Jet), Laminating Machine (Two side Laminateing), Re-winder, Plastic Extrusion Yarn, Weaving Machine (Water Jet) 부분을
다른 색으로 적용하시려면
아래의 코드를 각각 찾아서
<td>Plastic Extrusin Yarn</td><td rowspan="4">Weaving Machine (Water Jet)</td><td>Laminating Machine (Two side Laminateing)</td><td rowspan="2">Re-winder</td><td>Plastic Extrusion Yarn</td><td>Plastic Extrusin Yarn</td><td rowspan="3">Weaving Machine (Water Jet)</td>아래의 코드처럼 스타일을 추가해보시겠어요?
<td style="color: blue;">Plastic Extrusin Yarn</td>색상은 원하시는 색상으로 교체해보세요.
고맙습니다.
-
design_gooner (112 Point)ㆍ2019.10.14 10:50
Main Factory, 2nd Factory 는 굵게 만들고싶고요
Plastic Extrusin Yarn, Weaving Machine (Water Jet), Laminating Machine (Two side Laminateing), Re-winder, Plastic Extrusion Yarn, Weaving Machine (Water Jet) 는 다른 색으로 변경하고 싶습니다.
