CSSについて【鹿児島市のB型事業所】

2022年9月16日

前回HTMLについて記事をかせていただきましたが、今回はCSSについてご紹介させていただきます。

CSSはCascading Style Sheet（カスケーディング・スタイル・シート）の略で、HTMLと組み合わせて使用することで、Webサイトの色やサイズ、レイアウトなどのデザインを定義するための言語です。

別名で、よくスタイルシートと呼ぶ機会が多いです。

前回ご紹介したHTMLでは、決められたコードに文字の入力を行いサイト上に表示させることが可能となります。

※下の図はコードを記入してネット上に表示したものになります。

左がコード、右がその結果になります。

今のままでは色がついていない為、無機質な感じがします。

そこで文字や背景に色をつける際に使用するものがCSSなります。

図の中のコードの中に

<head>

<link rel=”stylesheet” href=”css/sample.css“>

</head>

といういう記述があると思います。

ここにstyleシートを設定して読み込むようにします。

記述が完了したら、sample.cssという新たなファイルが出来上がります。このsample.cssに記述を行い、背景や文字の色の変更を行います。では、色をつけてみましょう。

上記の図はCSSに記述を行ったことで表示結果に変化が出たことを表しております。

このようにCSS用のシートに記述を行うことで、表示結果を大きく変えることができます。

今回は細かいルールは省略させていただきますが、CSSによってどのように結果が変わるかを確認していただけたと思います。HTMLとCSSを組み合わせることで、無機質なものに変化をもたらすことができます。

次回CSSについてもう少し掘り下げて説明を行いたいと思います。

では、次回またお会いしましょう。

OAZOでは、利用定員を現在の10名から、20名へと増やしていく方針で、随時、新規利用者様を募集しております。体験利用も可能ですので、是非お問い合わせください。

就労継続支援B型事業所OAZO： https://oazo.smartwork.love/

住所：鹿児島市上之園町20-1 RI-NO館 III 3F

電話番号：080-8551-9849

メールアドレス：b-oazo@smartwork.love

SNS

文編集：吉永

よかったらシェアしてね！

コメント