HTML/CSS– category –
-
SCSS
【SCSS】for文・while文・each文の使い方/使いどころ
本記事では、SCSSでfor文・while文・each文の使い方について解説しています。実際にサンプルコードを用意しているので、どのような場面で使用するのかが少しは理解できると思います。 【for文の使い方】 for文の基本的な使い方は以下のとおりです。 @for $... -
SCSS
【SCSS】if文(else if,else)の使い方・使いどころ
本記事では、SCSSでif文(else if,else)の使い方・使いどころについて解説しています。 【if文の使いどころ】 JavaScriptなどのプログラミング言語では非常に使われるif文が、なんと!SCSSでも使用することが出来ます!どんなことが出来るんだろう!とワク... -
SCSS
【SCSS】@mixin/@includeの使い方と使いどころ
本記事では、SCSSの@mixin/@includeの使い方と使いどころについて解説しています。 【@mixin/@includeの使いどころ】 @mixin/@includeは、同じプロパティを使用するHTMLタグ(要素)が複数存在する時に使います。 例えば、使用するプロパティが同じボタンを4... -
SCSS
【SCSS】変数の使い方・使いどころ
本記事では、SCSSで変数を使う方法・どのような場面で変数を使うべきかについて解説しています。 【変数の使い方】 SCSSで変数を使う書き方は以下の通りです。 // 変数の宣言 $variable:value; 構文解説 $variable:値を代入する変数名を指定(何の値が代... -
HTML/CSS
JavaScript機能がOFFになっている環境のみ特定の文字を表示する方法
本記事では、JavaScript機能がOFFになっている環境のみ特定の文字を表示させる方法について解説しています。今はほとんどのデバイスがデフォルトでJavaScript機能がONになっているので、意図的にOFFにしているユーザーは少ないですが、必ずJavaScriptの処... -
HTML/CSS
Bootstrapの使い方が学べるおすすめの本
本記事では、Bootstrapの使い方が学べるおすすめの参考書を紹介しています。 気になった参考書があれば、購入する前にAmazonの無料試し読みで内容を確認することをおすすめします。 表紙がイラストをたくさん使っているから、内容も初心者向けだろうと思い... -
HTML/CSS
【CSS】テキストを中央寄せする方法
本記事では、CSSでテキストを中央寄せする方法について解説しています。 【text-align:center】 CSSでテキストを中央寄せする方法は、とても簡単でブロック要素に対してtext-align:centerを指定します。 .block-elem{ text-align:center; } ブロック要素が... -
HTML/CSS
【CSS】ユーザーに画像の保存を禁止させる方法
本記事では、ウェブサイトで公開している画像を保存させない方法について解説しています。CSSだけで実装することが出来るので、ウェブ初学者の方でも簡単です! 【ユーザーが画像を保存する時】 皆さんがウェブサイトを閲覧している時に、欲しい画像があっ... -
HTML/CSS
【CSS】display:flexで一番最後のアイテムだけ右寄せする方法
本記事では、display:flexで横並びになっている一番最後のアイテムだけを右寄せする方法について解説しています。 【marginを使う】 display:flexで横並びにしたアイテムの一つだけを右寄せにする。一見難しそうに見えますが実はとても簡単で、皆さんが頻... -
HTML/CSS
【CSS】display:flexで一番最初のアイテムだけ左寄せする方法
本記事では、display:flexで横並びになっている一番先頭のアイテムだけを左寄せする方法について解説しています。 【marginを使う】 display:flexは、flex-wrapやflex-directionなどの特別なプロパティを持っているため、先頭のみ左寄せするプロパティがあ...