css cssの書き方

cssの書き方カンマについての疑問はこの記事で解消

投稿日:2019年12月2日 更新日:

Pocket

うも、チャーさんです。

 

この記事ではcssの書き方の1つである

カンマについて書いてます。

 

なのでこの記事を読めば、あなたは

cssのカンマについての疑問が解消され、

さらにコーディングが早くなるでしょう。

 

 

という事で、cssのカンマについて知りたいなら、

このまま下にスクロールして読んでみてください。

 

スポンサードサーチ

cssの書き方でカンマ書くとどうなる?

 

cssの書き方でカンマ ,←これ

が使えるのですが、これは、複数に

cssを適用させるときに使います。

 

というのもcssではカンマで区切ることで、

クラスやタグの複数選択ができるからです。

 

 

例えば、見出しの文字を全部太字に

したい場合、以下のように

 

h1,h2,h3 {

font-weight:bold;

}

 

と書くと、h1もh2もh3も全部太字になります。

 

 

また

.class1,class2,class3 {

color:red;

}

 

などのようにクラスもカンマで区切る事で、

複数に一括指定することができます。

 

またこの場合、

class1,2,3全てに

赤文字になるcssが適用できます。

 

 

なので、cssではカンマを使うと、

cssを適用したい要素を複数一気に指定

できるというわけです。

 

カンマの使い道

 

ちなみに、これの使い道ですが、

 

webページの制作などでは、

とりあえずまずはじめにある程度

文字のサイズとか見出しのデザインとか、

 

そういうのをまとめてcss書きます。

なので、そういうときに使用される感じですね。

 

スポンサードサーチ

まとめ

 

という事でまとめですが、

cssの書き方の一つにカンマがありますが、

これを使うと要素を複数指定できます。

 

1つ1つのタグやクラスに対して

css書いてると手間なので、

同じ内容のcssの時はカンマを使って複数指定しましょう。

 

またcssの書き方は色々なものがあるので、

 

cssを学びたいなら、

cssの書き方をまとめました「よく使う内容を網羅」

を読みましょう。

 

それでは、読んでもらってありがとうございました。

 

チャーさん

 

 

 

 

-css, cssの書き方


スポンサードサーチ

関連記事

no image

cssで背景画像を表示するコードと方法「コピペOK」

どうもチャーさん(@chaa___san)です。     あなたはcssで背景画像を表示したいですか?   この記事ではcssで背景画像を表示する方法、 コード、あなた自 …

no image

cssのborderを初学者でもわかりやすいよう説明します

どうも、チャーさん(@chaa___san)です。   あなたはcssのborderとは何か? と疑問に思っていませんか?   この記事ではcssのborderについて、 初学者で …

no image

cssの書き方でフォントサイズについて知りたいならこの記事

どうも、チャーさんです。   この記事では、cssでフォントサイズ (文字の大きさ)を変える方法を書いてます。     なので、この記事を読めば、 あなたはフォントサイズ …

no image

見出しに横線をつける方法「webページ制作に便利」

どうも、チャーさんです。   あなたは見出しの横に、横線を表示させたい。 そう思っていませんか?   この記事では、見出しに横線をつける方法を、 書いています。(以下のようなのがで …

no image

cssで画像を丸くする方法「15秒以内にできます」

どうも、チャーさんです。   あなたはcssで画像を丸くしたい、 そう思っていませんか?   この記事では、cssで画像を丸くする方法を、 書いています。   &nbsp …

no image

positionで縦に中央寄せする方法はこちらです。

どうも、チャーさんです。   あなたはpositionで縦に中央寄せをしたいのに、 できずに困っていませんか?     この記事ではpositionで要素を縦に、 中央寄 …

no image

画像の高さを揃える方法「簡単にできる方法です」

  どうも、チャーさんです。   あなたはサイズの違う画像の高さを、 揃える方法を探していますか?   この記事では、webページ制作で直面する、 画像の高さを揃える方法 …

no image

cssで追随させる方法、スクロールしてもついてくるよ

  どうも、チャーさんです。   あなたは、cssでサイドバーなどを、 追随させる方法を知りたいと思っていませんか?     この記事では、スクロールしても、 …

no image

cssで背景画像をレスポンシブ対応させる方法「1行記述すればok」

どうも、チャーさんです。   あなたはcssで背景画像をレスポンシブ対応させたい、 そう思っていませんか?   この記事では、cssで背景画像を、 レスポンシブ対応させる方法を書い …

no image

liタグを横並びにする方法。この方法なら15秒でできますよ。

どうも、チャーさんです。   あなたがliタグを横並びにしたい、 そう思っていませんか?     この記事では、liタグを横並びにする方法を、 書いています。 &nbsp …

no image

メニューに下線をだすcss(マウスでホバーした時に)

どうもチャーさんです。 あなたはメニューに下線をだすcssを 探していますか?   この記事では、メニューの上に マウスを持っていくと、メニューに下線が 表示される方法を書いています。 &n …

no image

コーダーがphotoshopを使えた方がいいのかについて書きます。

どうも、チャーさんです。   あなたはコーダーはphotoshopを、 学んだ方がいいのか?   仕事獲得のためには、コーダーも、 photoshopを使えた方がいいのか? と疑問 …

no image

cssを動画で学習したいならこの記事をどうぞ

どうも、チャーさんです。 あなたは、cssを始めたい、 で、わかりやすく動画で学習したい、   そう思っていませんか?   この記事では、cssを動画で学習できるよう、 僕がとった …

no image

レスポンシブでフォントサイズを可変にする方法「手間いらず」

どうもチャーさんです。   あなたはレスポンシブで、 フォントサイズを可変にする方法を 探していますか?   この記事では、フォントサイズをレスポンシブで 自動調整できる方法を書い …

no image

cssで画像をトリミングする方法。「記述1行で完了」

どうも、チャーさんです。   あなたはcssで画像をトリミングしたい。 そう思っていませんか?   photoshopでトリミングするのめんどい、 cssでできんかな?と思ってませ …

最新記事

チャーさん

プログラミング・筋トレ・unity系の記事などを書いてます。

大学卒業後→開業→個人事業主7年目ぐらいです。webサイト制作したり、unityでゲーム開発しております。

youtubeもやってまして、主にプログラミング動画とかunity系の動画をあげてるので見てください。