4
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

HTMLとCSS、HTMLの構成

Last updated at Posted at 2021-02-03

###HTMLとは
▶︎webページ上に文字や画像などの情報を記載させることができる言語です。
ファイル名を〇〇.htmlとすることで作ることができます。
###CSSとは
▶︎HTMLで記述した文字などの情報を装飾することができる言語です。
ファイル名を〇〇.cssとすることで作ることができます。

また、ファイルを生成するときファイル名のあとにつける「.html」や「.css」のことを拡張子といいます。

この拡張子で言語の種類を識別することができます。


###HTMLの構成

HTMLファイルではまず、「これはHTMLの文章です」と宣言しなければなりません。そのときに使う要素がDOCTYPEhtml要素です。それぞれの記述は以下の通りです。

<!DOCTYPE HTML>
<html>
</html>

そしてhtml要素の中はhead要素body要素で構成されています。それぞれ
・head要素にはブラウザ上では表示されない基本情報など
・body要素にはブラウザ上に表示する情報
を記述します。

###head要素###
head要素内には基本情報として、meta要素,title要素,link要素などの要素を記述します。

<meta charset="UTF-8">
<title> </title>
<link rel="stylesheet" href="">

meta要素----charset(キャラセット)属性を指定し、文字コードを指定します。
title要素---ウェブサイトのタイトルを指定します。(ブラウザのタブなど)
link要素----rel属性をstylesheet,hrefにcssのファイル名を記述することでcssファイルを反映させることができます。


#####まとめるとHTMLの構成は以下のようになります。

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="UTF-8">
    <title>ウェブサイトのタイトル</title>
    <link rel = "stylesheet" href = "ファイル名.css">
  </head>
  <body>
  </body>
</html>

###次回はbody要素で主に使う要素達を紹介しきたいとおもいます!

4
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?