잡동사니에도 사랑을

[21.09.03] Hello.html 본문

JAVA_EE/HTML

[21.09.03] Hello.html

luvforjunk 2021. 9. 12. 20:54
728x90
반응형

</html>

 <head>

  <meta charset="UTF-8">

  <title>HTML 연습</title>

 </head>

 <body>

  <h1>안녕하세요!! 수정</h1> <!-- 굵게, 크기, 자동으로 줄 바꿈-->

  <h3>안녕하세요!! 수정</h3>

  <h6>안녕하세요!! 수정</h6>

  반갑습니다<br> <!--글씨를 밑에다 써도 한줄로 나온다. 줄 바꿈이 되지 않아서. 이럴 때 br-->

  반갑습니다<br>

  반갑습니다<br>

  <font color="red" size="1">반갑습니다</font><br>

  <font color="#ff9966" size="3">반갑습니다</font><br>

  <font color="#ffff66" size="5">반갑습니다</font><br>

  <font color="#339999" size="6">반갑습니다</font><br>

  <br> 

  <table border="1"> 테두리

   <tr> 한 줄(행)

    <td>가나다</td> 한 칸(열)

        <td>라마바</td>

   </tr>

 

   <tr>

    <td>사아자</td>

        <!-- align=left, center, right --> 정렬 - 왼쪽, 중앙, 오른쪽

        <td width="200" align="center">차카타파하</td>

   </tr>

 

   <tr>

    <td colspan="2"><img src="http://localhost:8080/tomcat.svg"></td> colspan="2" : 두 칸을 하나로 병합

   </tr>

  </table>

  <br>

  <div style="border: 1px solid red;">수정이는 천재</div>

CSS라는 style sheet는 자바로 예를 들면 String name = "홍길동"; 처럼 변수 잡아주 듯 변수 : 값; 써준다.

값을 여러 개 써도 상관없다.

1px solid red; => 테두리의 두께는 1px, 실선으로, 색상을 빨갛게.

table과 달리 div는 한 줄 단위로 잡기 때문에 창이 커지면 같이 커진다. table보다 div를 선호하는 이유 중 하나.

  <div style="border: 3px dotted blue;">수정이는 천재</div>

  <br>

 

  <div style="border: 1px solid red; width: 110px; float: left;">수정이는 천재</div> width: 110px; : 길이 / float : 상대를 기준으로 왼쪽으로 정렬

  <div style="border: 3px dotted blue; width: 110px; float: left;">수정이는 천재</div>

 </body>

</html>

 

<!-- 주석 -->

결과창

728x90
반응형

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

[21.09.09] exam09 - <thead>/<tbody>/<tfoot>  (0) 2021.09.09
[21.09.09] exam10 - cellpadding / cellspacing / colspan / rowspan  (0) 2021.09.09
[21.09.09] exam11 - id 속성과 class속성(버튼 색 바꾸기)  (0) 2021.09.09
[21.09.09] exam12 - 블록 레벨 요소(div, p, h1, ul)/인라인 레벨 요소(span)  (0) 2021.09.09
[21.09.09] exam13 - <mark>/<abbr>/<dfn>/<cite>/<small>/<ruby>  (0) 2021.09.09
'JAVA_EE/HTML' Related Articles more