본문 바로가기

프론트엔드개발/HTML,CSS,BS

[CSS]step.1 <td style=text-align:크기><h1>~<h5>

[CSS] HTML문서를 꾸며주는 언어 style

 

1. style 속성으로 태그에 넣기

<td style = text-align:center;color:blue">

                             프로퍼티 : 값           ;(구분,끝맺음) 프로퍼티: 값          

<td rowspan="3"style ="text-align:center;">항목</td>

프로퍼티 :  text-align( 정렬)

text-align: left

text-align: right

text-align:center


 - 텍스트 크기 정하기

<h1 style ="text-align:center;">h1 크기</h1>

h1 크기

h2 크기

h3크기

h4크기

h5크기

 

 

 

 

[실습 예제]

 

 

자기소개
상세 정보

항목

내용

2

3

4

5

6

7

8

9

 

<!-- 아래 차시 학습 시 활용하세요 :) 
17. CSS 언어 이해와 CSS 적용 방법 첫번째: style 속성으로 적용해보기 -->

<!DOCTYPE html>
<html>
<head>
    <title>자기소개</title>
</head>
<body>
    <center>
        <table width="600" border="1" cellspacing="0">
            <tr>
                <td></td>
                <td colspan="3"style="text-align:center">상세 정보</td>
            </tr>
            <tr>
                <td rowspan="3"><h4 style ="text-align:center;">항목</h4></td>
                <td style="text-align:center;"><h4>내용</h4></td>
       
                <td><h4 style="text-align:center;">2</h4></td>
                <td><h4 style="text-align:center;">3</h4></td>
            </tr>
            <tr>

                <td><h4 style="text-align:center;">4</h4></td>
                <td><h4 style="text-align:center;">5</h4></td>
                <td><h4 style="text-align:center;">6</h4></td>
            </tr>
            <tr>
                <td><h4 style="text-align:center;">7</h4></td>
                <td><h4 style="text-align:center;">8</h4></td>
                <td><h4 style="text-align:center;">9</h4></td>
            </tr>
        </table>
    </center>
</body>
</html>

 

====================================================

출처: IT UP, 코딩이 처음이어도 괜찮아! 진짜 입문자를 위한 웹개발과 IT 기초 지식
https://itup.co.kr/rv1/k-digital/main/lecture/info?course_uid=912417&education_uid=52212

잔재미코딩

https://www.fun-coding.org/

반응형