CSS | はるとブログ

aタグでhref属性に特定の値を持っているものにだけCSSを当てることができます。たとえば、 a[href="https://google.com"] { color: blueviolet; } とコーディングすると、 aタグでhref=”https://google.com”となっているものにだけCSSを当てることができます。参考にしたYouTube

CSS

2020.08.14

CSS 特定の属性を持っているものだけにCSSを当てる方法

CSSでは特定の属性を持っているものにだけCSSを適用することができます。たとえば、 a[href] { color: red; } とCSSを書くと、aタグでhref属性を持っているものだけ、CSS（文字色を赤）を当てることができます。参照したYouTube

CSS

2020.08.13

2つのクラスがついているタグのみにCSSを適用する方法

2つのクラスがついているタグのみにCSSを当てることも可能です。たとえば、 .title.big { background-color:pink; } この場合、titleとbigという2つのクラスが付されているところだけ、背景色をピンクにするCSSが適用されます。 index.html style.css ブラウザの表示参考にしたYouTube

CSS

2020.08.13
background-color, body,

CSSでページ全体の背景色を指定する方法 body background-color

CSSでページ全体の背景色を指定するには、bodyタグにbackground-colorをつけます。 body { background-color: pink; } 参考にしたYouTube

CSS

2020.08.12
calc, width,

CSS widthをcalcを使って指定する方法 width: calc(100% / 3) etc.

CSSでwidthを指定するとき、calcを使って計算された値にすることができます。たとえば、 width: calc(100% /2 ) と指定すると、ブラウザの横幅の半分にすることができます。ブラウザの表示↓ width: calc(100% / 3) と指定すると、ブラウザの横幅の1/3の幅にすることができます。ブラウザの表示↓ ちなみに、MDNリファレンス […]

CSS

2020.08.12
font-size, rem,

CSS font-sizeを単位 rem で指定する方法

font-sizeを指定するとき、remという単位を使うことができます。これは、HTML要素のサイズ（既定は16px）の何倍かという単位です。たとえば、5remは80pxです。 5rem = HTML要素のサイズ 16px × 5 　 = 80px となります。 5remの表示（Google Chrome） 3rem は 48pxです。 3rem = 16px × […]

CSS

2020.08.06
インラインスタイル, 内部スタイルシート, 外部スタイルシート,

HTMLにCSSを適用する方法3つ

HTMLにCSSを適用する方法は3つあります。・外部スタイルシート・内部スタイルシート・インラインスタイル外部スタイルシートこれが最もよく使われる方法です。 <head>タグ内に<link>タグを追加し、CSSを読み込みます。 <link rel=”stylesheet” href=”style.css […]