花の歌奏

みなさま、こんにちはー(*´ω｀*)ﾉ
花です(*´ω｀*)


ワードがひと段落して、ワードなんて興味ないのにといやいや読んでた人もいるのではないでしょうか！

そういう方々にこの言葉を送ります。


ごめんなさい！


ネタがなくなってワードに行ったんじゃないかというお言葉も正直あったのですが、そういうわけではないのです。

私のブログは初心者〜中級者に向けてのブログにしていこうと思っています。

とりあえず、今は！

なので、この先難しいことを書くことになるかもしれませんが、ひとまず今は初心者〜中級者向けの記事を書くようにしているため、ワードの話もどうしても書きたかったのです(´・ω・｀)

とはいえ、思った以上にワードのお話が長くなってしまってごめんなさい(´・ω・｀)

途中で分けようかとも思ったんですが、ものすごく中途半端になりそうなので思いっきって全部やってしまいました＞＜

でも、後悔はしてません(笑)

いつか、他のいろんなワードの事もお話しできたらなぁと思っているので、その時はよろしくお願いします(*´ω｀*)


それでは、今回はホームページの作り方のお話をまたしたいと思っています。

それでは頑張りましょー(*´ω｀*)ﾉ



それでは、質問です。

今回は、なぞなぞです(*´ω｀*)

目に足が２本はえている水の中の生きものってなんでしょう？

正解は、最後に(*´ω｀*)


今までCSSの内容に入ってお話したものはこれだけあります。

文字色　color
文字サイズ　font-size
背景色　background-color
背景画像　background-image
背景の繰り返し　background-repeat
背景の位置　background-position
背景のサイズ　background-size
背景の固定　background-attachment
横幅　width
縦幅　height
枠線　border
枠線内の余白　padding
枠線外の余白　margin

ブロックレベルの囲い　div
インラインの囲い　span

名前　id

それぞれよく使うものなので、よかったら私のブログを読み返してみてくださいね(*´ω｀*)

では、今回は肩慣らしとして、

max-width
min-width

のお話をしたいと思います。

widthに関しては、以前もお話したことがあるし、今回も上に横幅と書いてあるので分かると思います。

じゃあ、maxとminが頭についたらどうなるかというと、もうそのままですね(笑)

max-widthは最大幅を決めることができ、min-widthは最小幅を設定できます。

これを設定すると何がいいのかというと、

例えば、CSSでこういう書き方をしていたとします。

div {
max-width: 1000px;
min-width: 100px;
}

これがどういう状況かというと、最大の幅は1000pxです。

これはどんなにブラウザが広がっても1000px以上は広がらないということになります。

そして、最小幅が100pxとはどんなにブラウザの幅が狭くなっても100pxより小さくならないということです。

ちなみに、ブラウザが100pxより小さくなったときは隠れます(笑)

でも、これってそんなに使うの？って思った人いるかもしれません。

実はこれ、よく使うんです。

ただし、使い方はちょっと違います。

以前お話した、ホームページを作る上で、このサイズからこのサイズはこんな感じに見えて、それ以上のサイズはこう見えて……みたいなお話覚えている方いますでしょうか？

レスポンシブWebデザインのお話ですね(*´ω｀*)

要は、スマホのサイズだとこう見えてパッドの様な少し大きめな画面だとこう見えて、それ以上の大きさだとこう見えるというお話です。

ちなみに、そのお話はコチラの記事で書いています。

3日分の記事になりますが、レスポンシブWebデザインのお話を書いているので読んでみてくださいね(*´ω｀*)

ということで、

max-width
min-width

はそちらで使うことが多いです。

普段でも使うことは割とあるんですけどねー。


ということで、今回はこの辺でー(*´ω｀*)ﾉ

なぞなぞの答えは「貝」でした(*´ω｀*)

では、~~~ヾ(*'▽'*)o マタネー♪