フロントエンドとバックエンドの分離のレッスン 2 -- Vue/Css/js/html の作成

1.HTMLファイルの作成

<!DOCTYPE html>
<html lang="ja">

<head>
    <!-- <meta> タグは通常、<head> 領域内にあります。
    <meta> タグは、HTML ドキュメントのメタデータを提供します。メタデータはクライアントには表示されませんが、ブラウザによって解析されます。-->
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width、initial-scale=1.0" />
    <meta http-equiv="X-UA-互換性" " content="ie=edge" />
    <title>学生情報管理システム</title>
    <!-- CDN を使用して Vue モジュールを導入します-->
    <script src="https://cdn.jsdelivr.net/npm / [email protected]"></script>
    <!-- CSS から外部スタイル ファイルを導入 -->
    <link rel="stylesheet" href="./css/index.css">
</head>
<body >
    <!


    </div>

</body>
</html>

2. XSSファイルの作成

/* indx.css でコンテナ アプリのスタイルを定義します*/

#アプリ{

    幅:800ピクセル;

    高さ:400ピクセル;

    背景色: 水色;/*背景色*/

    margin:100px auto;/*上からの高さ*/

    font-size:40px;/*フォントの高さ*/

    行の高さ: 200px;

    text-align: center;/*フォントセンター*/

    border-radius: 10px;/*四隅の曲率*/

    色: 赤;/*フォントの色*/

}

3.jsファイルを作成する

const app= 新しい Vue({

    el:'#app',//ID app を持つコンテナに適用されます

    データ:{

        msg:'こんにちは、Vue',

    }

})

おすすめ

転載: blog.csdn.net/qq_40333984/article/details/126282749