CSS

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

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

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

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

CSSでよく使う、IDセレクタ、classセレクタ、要素型セレクタ（タイプセレクタ）には優先順位がある。 IDセレクタ＞classセレクタ＞要素型セレクタ、の順だ。 ちなみに要素型セレクタというのは、HTMLのタグを指定するセレクタのことね。 例えば、h2{ color : red;}って感じのやつ。 この優先順位をし...

CSSのセレクタの基本はHTMLタグ（h2とかpタグとか）だけど、同じタグのデザインが全て同じだと困る。 ということでオリジナルのセレクタがCSSには用意されていて、それが classセレクタ IDセレクタ の２つだ。 classセレクタ classセレクタは、 <div class="skill">~~&...

CSSの記述のルールってよく忘れがちなので、備忘録で整理しておく。 CSSには セレクタ(基本はHTMLのタグ:h2とかpとか） プロパティ バリュー という3つの設定がある。 この名称がCSSをわかりにくくしているとプ…...

最近サイトを作っても、スマホやタブレットに対応させないと話にならないよね。 ワードプレスで既存のテーマを選べば、そこまで設定してくれているからあんま考えなくていいけど、プログラミングマスターを目指すプログラミング小僧としては、どんなやり方があるのか把握だけはしておきたい。 ワードプレスでサイトをスマホ対応・タブレット対...

ちょっと高度なことに手を出してみたのだけど、ワードプレスの管理画面上に独自でCSSを適用させる方法を調べてやってみた。 今回やったのは、テーマファイルのディレクトリのcssフォルダ内にadmin.css（名前は何でもいい）をアップロードして、admin.cssで管理画面のデザインを変更する方法。 やり方は↓ 使うのはa...

CSSのコードを見ていて、よくわからないやつがあった。 #wrapper { width: 100% !important; } ってやつだ。 「なんだこの !important　ってやつは？？」 ってことで調べてみた。 !important とは？ !importantはスタイルを優先させることが出来るらしい。 ただ...