글씨 크기를 변경하는 방법을 알려주세요..ㅠㅠ

커뮤니티

포인트

쿠폰

내 강의실

국비 신청 내역

증명서

계정

로그아웃

학습 질문

개발 일지

나의 활동

답변 완료

글씨 크기를 변경하는 방법을 알려주세요..ㅠㅠ

undefined주차

강*웅

・

추천

・

조회수

답변 완료

제가 2주차의 숙제를 하고 있는데, PyCharm의 웹사이트에서 잘되었나 확인을 할려고 들어가니까, 들어오니 온도 적은 글씨가 너무 작게 나오더군요.

글씨의 색깔도 바꾸고 싶은데 방법을 몰라서 질문 합니다.

글씨 크기를 바꾸고 글씨의 색깔을 바꾸는 방법을 알려주세요, 부탁드립니다.

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
          integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
            integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
            crossorigin="anonymous"></script>

    <title>귀여운 시대 방명록 만들깅^^</title>
    <link href="https://fonts.googleapis.com/css2?family=Jua&family=Nanum+Pen+Script&family=Noto+Sans+KR:wght@100&display=swap"
          rel="stylesheet">
    <style>
        * {
            font-family: 'Nanum Pen Script', cursive;
        }

        .happyday {

            background-position: center;
            background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url("https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&fname=https%3A%2F%2Ft1.daumcdn.net%2Ftistoryfile%2Ffs16%2F25_tistory_2010_08_14_17_49_4c66589de3072%3Foriginal");
            background-size: cover;

            height: 270px;
            width: 100%;

            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;

        }

        .happyday > h1 {
            font-size: 100px;
            color: pink;
        }

        .nowloding {
            max-width: 500px;
            width: 95%;
            margin: 20px auto 0px auto;

            box-shadow: 0px 0px 3px 0px pink;

            padding: 20px;
        }

        .button-box {

            margin-top: 20px;
        }

        .mycards {
            width: 95%;
            max-width: 500px;
            margin: auto;
        }

        .mycards > .card {
            margin-top: 10px;
            margin-bottom: 10px;
        }
    </style>
    <script>
        $(document).ready(function () {
            $.ajax({
                type: "GET",
                url: "http://spartacodingclub.shop/sparta_api/weather/seoul",
                data: {},
                success: function (response) {
                    let url = response['url']
                    let msg = response['msg']

                    $('#img-rtan').attr('src', url)
                    $('#text-rtan').text(msg)
                }
            })
        });
    </script>
</head>

<body>
<div class="happyday">
    <h1>귀여운 시대 팬명록~~</h1>
    <p>현재기온 : <span id="temp">00.0</span>도</p>
</div>
<div class="nowloding">
    <div class="form-floating mb-3">
        <input type="email" class="form-control" id="floatingInput" placeholder="name@example.com">
        <label for="floatingInput">닉네임</label>
    </div>
    <div class="form-floating">
        <textarea class="form-control" placeholder="Leave a comment here" id="floatingTextarea2"
                  style="height: 100px"></textarea>
        <label for="floatingTextarea2">응원댓글</label>
    </div>
    <div class="button-box">
        <button type="button" class="btn btn-dark">응원 남기기</button>
    </div>
</div>
<div class="VSS">
    <div class="mycards" id="comment-list">
        <div class="card">
            <div class="card-body">
                <blockquote class="blockquote mb-0">
                    <p>진짜 짱임, 너무 이뻥~</p>
                    <footer class="blockquote-footer">내가</footer>
                </blockquote>
            </div>
        </div>
        <div class="card">
            <div class="card-body">
                <blockquote class="blockquote mb-0">
                    <p>진짜 짱임, 너무 이뻥~</p>
                    <footer class="blockquote-footer">말한</footer>
                </blockquote>
            </div>
        </div>
        <div class="card">
            <div class="card-body">
                <blockquote class="blockquote mb-0">
                    <p>진짜 짱임, 너무 이뻥~</p>
                    <footer class="blockquote-footer">단다~!</footer>
                </blockquote>
            </div>
        </div>
    </div>
</div>

</body>


</html>

댓글 알림