<style>

[- Disclaimer -] 아래 내용은 정보보안 공부 목적으로 작성된 것이나, 이를 토대로 허가되지 않은 대상에 실습을 진행할 경우 해킹 시도로 간주하여 법적 처벌을 받을 수 있음을 알려 드립니다.

<Style>

✦ 폰트, 색 등 지정

✦ 바로 값을 넣는 방식

✧ Ex) style="color:blue;"

✦ 자주 사용되는 방식

✧ <head> 안에 <style>을 넣어 현재 Web Page 전 범위에 적용

<head>
    <style>
        body {background-color:lightgray;}
        h1 {color:blue;}
        p {color:green;}
    </style>
</head>
Plain Text
복사

✦ style sheet 적용

<!doctype html>
<html>
    <head>
        <title>LOGIN TEST PAGE</title>
        <style>
            th.th1 {
                border:1px solid #0086b3;
                width:100px;
            }
        </style>
    </head>
    <body>
        <h1 align="center" style="color:#0083b3;">
            Super Start K
        </h1>
        <form method="post" action="login_check.php">
        <table align="center">
            <tr>
                <th colspan="2" style="background-color:#2d5986">
                <font style="color:white;font-size:150%">LOGIN</font>
                </th>
            </tr>
            <tr>
                <th class="th1">ID</th>
                <td><input type="text" name="user_id" size="14"/></td>
            </tr>
                <th class="th1">Password</th>
                <td><input type="password" name="user_pw" size="15"/></td>
            <tr>
                <td colspan="2" align="center">
                <input type="submit" value="확인">
                <input type="reset" value="지우고 다시 작성">
                <a href="">회원가입</a></td>
            </tr>
        </table>
        </form>
    </body>
</html>
Plain Text
복사

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="styles.css">
    </head>
    <body>
        <h1>This is a heading</h1>
        <p>This is a paragraph.</P>
    </body>
</html>
Plain Text
복사