잡동사니에도 사랑을

[21.09.16] practice03(css) - 테이블 만들어 색상과 코드 집어넣기 본문

JAVA_EE/CSS

[21.09.16] practice03(css) - 테이블 만들어 색상과 코드 집어넣기

luvforjunk 2021. 9. 16. 17:35
728x90
반응형

문제 - 실행결과창

 

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

<style type="text/css">

td {

        width: 60px;

}

</style>

</head>

<body>

<h2>색 이름과 코드</h2>

   <hr>

   <table border ="1">

      <thead>

         <tr>

            <th>이름</th>

            <th>코드</th>

            <th>색</th>

            <th>이름</th>

            <th>코드</th>

            <th>색</th>

         </tr>

      </thead>

     

      <tbody>

         <tr>

            <td>Brown</td>

            <td>#A52A2A</td>

            <td style= "background-color: #A52A2A;"></td>

            <td>DeepSkyBlue</td>

            <td>#00BFFF</td>

            <td style= "background-color: #00BFFF;"></td>

         </tr>

         <tr align = "left">

            <td>Blueviolet</td>

            <td>#8A2BE2</td>

            <td style= "background-color: #8A2BE2;"></td>

            <td>Gold</td>

            <td>#FFD700</td>

            <td style= "background-color: #FFD700;"></td>

         </tr>

         <tr align = "left">

            <td>DarkOrange</td>

            <td>#FF8C00</td>

            <td style= "background-color: #FF8C00;"></td>

            <td>OliveDrab</td>

            <td>#6B8E23</td>

            <td style= "background-color: #6B8E23;"></td>

         </tr>

      </tbody>

   </table

</body>

</html>

 

 

 

728x90
반응형

'JAVA_EE > CSS' 카테고리의 다른 글

[21.09.16] exam01(02_cssSelector) -  (0) 2021.09.16
[21.09.16] practice04(css)  (0) 2021.09.16
[21.09.15] pratice02(css) -  (0) 2021.09.15
[21.09.15] pratice01(css) -  (0) 2021.09.15
[21.09.15] exam08(01_css) -  (0) 2021.09.15
'JAVA_EE/CSS' Related Articles more