箇条書きリスト（ulタグ）は通常は縦に並ぶ。 箇条書きを超シンプルなコードで書くと下記のようになる <ul> <li>さる</li> <li>とり</li> <li>いぬ</li> </ul> 表示結果↓ さる とり いぬ ...

クリックすると別のページに飛ぶリンクテキストには大抵デフォルトで下線が入っている。 例えば↓の感じで。 こんな感じで下線が入る ただ、その下線が邪魔だから消したい時が結構ある。 そういう時に使えるのがtext-decorationプロパティだ！ 下記のようにリンクを作るaタグもしくはaタグに設定するclassやidにt...

「ここの文章、行間が狭くて読みにくいな。」 と思う時がある。 そういう時に使えるのが、行の高さを調整するline-heghtプロパティだ。 これは文字の大きさを決めるfont-sizeプロパティと合わせて設定すると行間をうまくコントロールできる。 例えば、下記のように文字のサイズが14pxの場合。 p { font-s...

CSSで「文字に影を付けたい！」という時は、text-shadowプロパティを使う。 ボックス自体に影をつけたい場合は、box-shadowプロパティを使う。 それと同じように、文字にはtext-shadowプロパティを使うのだ。 例えばHTMLのpタグの文字に影を入れるとする。 その場合の指定の仕方は下記の通りだ。 ...

floatプロパティを使って、画像の横に文章を回り込ませたはいいけど、 「画像と文章がくっついて見づらい、、、」 という時が多々ある。 そういう時はmarginを使って、画像と文章の間にすき間を空ければいいことを学んだ。 例えば、下記のように指定し、画像を左側に配置して、文章を右側に回り込ませたとする。 img { f...

CSSの記述をしていて、「画像の横に文章を回り込ませたい！」って時は多い。 そういう時はfloatプロパティを使えばいい。 HTMLで <img src="~" alt="写真"> と記述するだけでは文章は画像の下に配置されるから、画像の横にスペースがあっても、回り込めない。 それを回り込ませるためには、f...

プログラミングを勉強しているとよく出てくる絶対パスと相対パス。 この2つが混乱しがちだったので備忘録兼ねて整理しておきたいと思う。 絶対パス なんか難しく感じるけど、要は 絶対パスはURLなど。 →たとえば、https://programmingnote.jp　とか。 トップの位置から目的地までの道筋はどうか？ってのを...

HTMLの一部のデザインを変更したい時によく使う class="～"や id=”～”。 CSSの記述の時は .～｛｝のやつね。 その～（これ、セレクタって名前ね）の名前を付ける時は注意すべきことがある。 使えるものが制限されているからだ。 セレクタ名（class="～"の～の部分のことね）で使えるのは 半角アルファベッ...

CSSを勉強している時に出てくる疑似クラス。 なんてわかりにくい用語なんだろう（笑） 絶対用語の難しさが理解を妨げている気がする、、、 って文句はこれぐらいにしておいて、 「疑似クラスとはなんじゃい？」 ってことで簡単に…...

先日サイトをSSL化してhttps://～にした。 サイト自体のSSL化はさくらのレンタルサーバーだったから、かなりやりやすかった。 でも、サイトをSSL化するということはhttps://~にhttp://~から変更するということだから、 「サイトをSSL化できた！はい、おしまい！」 ということではなかった。 必要な作...