HTML CSS を使用してシンプルなポートフォリオ Web サイトを作成する |ポートフォリオ ウェブサイト ソース コード

1823 ワード
css html webdev javascript テキストリンク
何よりもまず、Web サイトのバックボーンである HTML ファイルを作成する必要があります. HTML ファイルを作成し、「index.html」という名前を付けました. CSSも使用するので、同じフォルダーに「styles.css」という名前のCSSファイルを作成しました. index.html では、次のコード行を指定する必要があります.

<!DOCTYPE html>  
 <html lang="en">  
 <head>  
   <meta http-equiv="X-UA-Compatible" content="IE=edge">  
   <meta name="viewport" content="width=device-width, initial-scale=1.0">  
   <link rel="stylesheet" href="./styles.css">  
   <link rel="preconnect" href="https://fonts.googleapis.com">  
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>  
   <link rel="preconnect" href="https://fonts.googleapis.com">  
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>  
   <link href="https://fonts.googleapis.com/css2?family=Lato:wght@100;400;700&family=Poppins:wght@200&display=swap"  
     rel="stylesheet">  
   <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@200&display=swap" rel="stylesheet">  
   <title>Portfolio</title>   
 </head>  
 <body>  
 </body>  
 </html>


VS Code を使用していて、HTML 拡張機能がインストールされている場合は、「!」と入力して Enter キーを押すだけです.そうでない場合は、これらの行を自由にコピーして貼り付けてください.それらについて議論する必要はありません.Web ページを実行しようとしていることをブラウザーに知らせるものであることを知っておいてください.また、「styles.css」に記述するすべての CSS をインポートしています.

今、私たちが構築しているものを見てみましょう.read more[][( https://www.codewithrandom.com/2021/12/simple-portfolio-website-using-html-css.html) ]
Programmers Hash Bestアルバム
# Chapter 05. 迷宮を脱出する