/*HTML*/
<span>人気のプログラミングスクール</span>
/*CSS*/
<style>
span {
background: linear-gradient(
#8dcaef, #1B95E0); /*背景色*/
border: solid 1px blue; /*枠線装飾*/
border-radius: 2em; /*枠線の角丸*/
color: white; /*文字の色を白色*/
font-size：15px; /*文字のサイズ*/
padding: 0.5em 1em; /*文字周囲余白*/
}
</style>
このボタンは、上のCSSで装飾して作成したものです。
CSSは、ウェブページをデザイン・装飾するのに使われるスタイルシート言語です。
CSSとは
CSSは「Cascading Style Sheets」の略です。意味は「要素について段階別に装飾を指定した文書・シート」となります。要するにデザインを整える言語ということです。
背景や文字の色や余白を指定して、ウェブページの文字や画像を綺麗にデザインしていくことができます。
上のCSSコードのなかで使っている英単語は中学英語くらいの単純なものです。
ウェブコーディングでは、HTMLと共に使用されます。ウェブページをレイアウトするHTMLのタグについて、それぞれをCSSで装飾することでウェブページのデザインが整えられていきます。
プログラミング言語ではありませんが、プログラミングスクールのほとんどのコースでは、HTML&CSSがカリキュラムに含まれています。
プログラミング未経験者でも、記述が単純なので理解しやすく、デザイン自体の面白みを感じながら学習していくことができる言語です。
-
-
プログラミング言語の特徴【できること・得意分野を解説】
CSSの特徴
CSSは、未経験者でも学習しやすい特徴を持つ言語です。
- ウェブページと親和性が高い
- HTMLとセットで使われる
- HTMLがウェブレイアウトを担うのに対し、CSSはウェブデザインを担う
- プログラミング言語のような制御構文を持たない
CSSで使用する単語は、中学英語の単語レベルです。
プログラミング言語のような制御構文を持たないため、単純に記述方法を覚えていくだけでスキルとして身について行きます。
プログラミングスクールで真っ先にHTML&CSSを教える理由には、挫折する可能性が低く、コーディングの面白みを知ることができるということもあるでしょう。
CSSでできること
CSSでできることは、主に次のとおりです。
- ウェブページの装飾・デザイン
- アプリ画面の装飾・デザイン
CSSはウェブデザインのベースであり、ウェブデザイナーの必須のスキルです。記述はとても単純ですが、CSSの知識量や経験がそのままデザイン力として反映されるため、それがデザイナーの力量として表れます。
ウェブデザイナーを志望する人は、HTMLと同時にCSSを学習していくと良いでしょう。
テックアカデミー HTML/CSSトレーニング
は、HTMLとCSSを2週間で学習できるコースです。未経験者におすすめです。
HTMLとCSSの関係性
HTMLとCSSの関係性は、次のとおりです。
| HTML | CSS |
|---|---|
| ウェブページのレイアウト | ウェブページの装飾・デザイン |
ウェブサイト制作では、HTMLでウェブページのレイアウトを行い、CSSで装飾・デザインを行います。
色付けや文字の太さ、背景色、配置、余白などをCSSで調整し、バランスよく整えていくのがCSSの役割です。
CSSの難易度
- 開発環境：ウェブブラウザ、エディター（メモ帳など）
- 型付け：概念なし
- コンパイル：不要
- 動作環境：ウェブブラウザ
CSSの難易度は、言語のなかでももっとも易しいレベルです。
ちょっと小難しいことを並べましたが、要するにウェブブラウザとエディターがあれば開発できるほど学習しやすいです。
つまり、パソコンを持ってさえいれば、今すぐ学習を始めることも可能なわけです。
CSSの学習方法
CSSの学習は、独学でも可能です。
学習にはウェブブラウザとエディターが必要です。ウェブブラウザはGoogleChromeが良いでしょう。ウェブページが表示された状態でF12を押すと、そのページの正体（HTMLとCSS）を見ることができます。
独学での学習方法は、主に2通りあります。
- ウェブで調べながら学習する
- 本を購入して学習する
ウェブで検索することがクセになっている人は、自分で調べながら学習することができます。ただ、学習計画を自分で立てなければ学習順序がわからないかもしれません。
独学するときは、何か1冊でよいのでHTML&CSSの参考書に頼るのがおすすめです。
パソコンスキルに不安がある人は、プログラミングスクールを頼るのが良いでしょう。
テックアカデミー HTML/CSSトレーニング
は、プログラミング未経験者でも2週間でHTML&CSSの基礎を学習できるコースです。
受講料がもっとも低価格なので、このコースを利用して短期間で一気に身につけてしまうのも良い方法です。
まとめ
- CSSは、ウェブサイトを構成しているHTMLを装飾するスタイルシート言語。CSSで使っている英単語は中学英語くらいの単純なもの。
- CSSは「Cascading Style Sheets」の略。意味は「要素について段階別に装飾を指定した文書・シート」
- プログラミング未経験者でも、記述が単純なので理解しやすく、デザイン自体の面白みを感じながら学習していくことができる。
- CSSでできることは、ウェブページやアプリ画面の装飾・デザイン。
- CSSの難易度は、言語のなかでももっとも易しいレベル。
- CSSの学習は、独学でも可能。ウェブや本で学習できる。
- パソコンスキルに不安がある人は、プログラミングスクールを頼るのが良い。
テックアカデミー HTML/CSSトレーニング
は、プログラミング未経験者でも2週間でHTML&CSSの基礎を学習できる。
