CSS 【CSS】[ ] の意味とは!?特定の属性を持つ要素にスタイルを適用させたい時に使おう 2020年12月21日 CSSのコードを見ていて、 audio:not() { display: none; height: 0 } とか { display: none } というコードを見るのだが 「いったい、という感じでで囲うことで何を意味しているんだ?」 と疑問に思っていた。 「CSSのってどんな意味?」 と調べても、なかなか疑問を直...
HTML 【HTML】タグと要素の違いとは? 2020年12月15日 今回はHTMLの「タグ」と「要素」の違いについて整理してみようと思う。 HTMLのタグとは? タグは<(小なり記号)と>(大なり記号)で囲まれている部分のことを言う。 <p> <a> <ul> などが挙げられる。 開始タグと終了タグがある 「タグ」には開始タグ(<p>など...
CSS 【CSS】display:blockとdisplay:inlineの違いって何?? 2020年12月14日 今回はCSSにおけるdisplay:blockとdisplay:inlineの違いについて整理したいと思う。 この2つの違いを理解することは初心者にとってめちゃくちゃ重要だ! 「マジかよ。CSSが効いてないじゃん、、、」 という知識不足の失敗を少しは防ぐことが出来るようになる。 HTMLタグの初期値にはどちらかが設定さ...
CSS 【CSS】white-space:nowrap ってどういう意味?white-space:normalとの違いは? 2020年12月13日 最近、CSSのフレームワークであるBootstrapを勉強している。 勉強している時に、Google Chromeの検証ツールで 「どのようにCSSで指定されてるのか?」 を確認していると white-space:nowrap というCSSの指定をよく見るが、意味がぜんぜんわからなかった(笑)。 「CSSのwhite-...
JavaScript 【JavaScript】alert() はメッセージを伝えるためのアラートダイアログを表示する 2020年12月10日 WEBページに動きをつける役割を果たすJavaScript。 JavaScriptの基本の内容が載っている本に必ず載っているのが alert()だ。 alert()はメッセージを伝えるダイアログを表示する alert()はメッセージを伝えるためのダイアログを表示する命令文。 パスワード間違った時とかに ↑のように表示さ...
CSS 【CSS】white-space:normalってどういう意味? 2020年12月10日 CSSの勉強をしていて 「white-space: normalってどういう意味なんだろう?」 と思ったので調べてみた。 white-spaceとは余白のこと そもそも 「white-spaceって日本語でどういう意味?」 という疑問があった。 white-spaceの英単語自体の意味は「余白」「空白」ということだそう...
CSS 【CSS】CSSの色指定は基本的に16進数カラーコード(#rrggbb)を使おう! 2020年12月8日 「このページの見出しの色を赤色にしたい!」 という感じで色指定をしたい時はホームページの作成・修正をしていれば必ず出てくる。 CSSで色を指定する方法は カラーコード:#英数字 カラーネーム:色の名前 RGB:rgb(赤の数値 緑の数値 青の数値) HSL:hsl(色相の数値, 彩度の数値, 輝度の数値) などがあるが...
CSS 【CSS】文字の太さを変えたいなら、font-weightプロパティを使う! 2020年11月27日 文字の太さを変えたい時に便利なのが、font-weightプロパティだ。 「見出しをもっと太くして目立つようにしたい!」 「ここの文字は少し細めにしたい!」 という時にこのfont-weightが使える。 文字を太くしたい場合はfont-weight:bold 文字を太くしたい場合に手っ取り早いのは font-weig...
HTML 【HTML】preタグって何?どんなことを表すために使うのか? 2020年11月23日 他のサイトを見ているとたまに <pre>~</pre> というタグを見ることがある。 このpreタグって何なのか? どういう時に使うのか? がわからなかったので調べてみた。 preとは「Preformatted Text」の略 preは「Preformatted Text」の略だ。 1つずつ単語を訳す...
CSS 【CSS】メモ書きを残したい(コメントアウト)場合はどうやって書く? 2020年11月21日 CSSで 「このコードの意味はこういうこと。」 という感じでメモや注意書きを残しておきたいことがよくある。 特に私のような初心者の場合、勉強している中で理解したことなどを 「このコードがあのコードにつながっている!」 という理解したことをHTMLやCSSに残しておくと見返した時にかなり便利だ。 (もちろん理解したことを...