ディジタル時計


ディジタル時計
コメントサイト
1.(折り曲げ)入力文字のJavaScript基礎科目-符号化なし
2.(youtube)Webコード入門チュートリアル(https://www.youtube.com/watch?v=_nJl75kn3yY&list=PLkbzizJk4Ae_ZCinIZzwLf4XDh1NvjmyE&index=6)
3.箱を中央に移動する方法(https://www.youtube.com/watch?v=mVYgtzDLZfY)
4. https://deeplify.dev/front-end/markup/align-div-center
サイトの真ん中にデジタル時計を作る小さなプロジェクトです.
講座はInfranのUnicode先生の授業の最初の小さな項目に私の考えを加えて、変形を試みました.
私の考え:ホームページは分かれていないで、直接divを中央に移動しました.
unicode:bodyラベルをWebページ全体に作成し、bodyを基準にdivを中央に移動します.
htmlのレイアウトを探すと、cssを使用するflexまたはgridが見つかります.
しかし、レイアウトがなければdiv boxは真ん中までしか行けないので、以下のように書いてみました.
body{
    background-color: black;
}

.clock{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    text-align: center;
}

.time{
    text-align: center;
    color: white;
}
とても简単な内容です...理解するのに長い時間がかかったと思います.ほほほ
次の画像は最終結果です.