2022-05-11CSS

Thumbnail of post image 086

vov.css

<head></head>にcssを読み込みます。CDNで呼び出すこともできます。

<link rel="stylesheet" href="vov.min.css">

使い ...

CSS

Thumbnail of post image 195

画像とテキストを横に並べてなおかつ画像の縦方向の真ん中にテキストを置きたい時あります。サイトのヘッダーなどでロゴ画像とサイトタイトルを並べたい時など。。。

floatやflexboxを使っても良いのですがシンプルにインライ ...

CSS

Thumbnail of post image 078

CSSの擬似要素(::before,::after)のcontentプロパティにFont AwesomeのWebフォントの値や丸数字(丸付き数字①②③④⑤⑥⑦⑧⑨⑩)、♥や♠などのような特殊文字を表示する方 ...

2022-05-15CSS

Thumbnail of post image 177

新しいPC(Windows10)に入れていたSublime Text3でCompassのビルド設定をしていなかったのでしばらくぶりに設定をした時の覚書とエラーが出たのでその対処方法。

Ruby がインストールされていて、既 ...

CSS

Thumbnail of post image 145

印刷用のスタイルシートを修正したいとき、修正箇所などを確認する方法。

Google Chromeで簡単に確認できるのを知りました。

1)デベロッパーツールを開く

2)右側のXの横にあるメニューをクリ ...

CSS

Thumbnail of post image 082

お恥ずかしいでところですが、初めてその状況になって初めて学んだこと。

フォームで、テキストを打っている時、違和感が。。。
よくよくみると、変換する前の文字がなぜか消えてる!?

原因は、CSSの設定でした ...

2022-05-15CSS

Thumbnail of post image 173

長年愛用してきたmacbookpro(2008 early)に別れを告げるべく、ついに新型MJLT2J/Aを購入しました。
appleサイトでは、15.4インチ 2.5GHzは、282,800円(税別) 2015年10月20日 ...

2019-07-19CSS

Thumbnail of post image 014

テキストや要素をセンタリングするのにちょっくら迷ったのでこの機会にまとめておくことに。

text-align:centerを使う

最もカンタンと思われる方法。
但し、インライン要素にしか効かない。
なんで効か ...

CSS

Thumbnail of post image 121

:first-child擬似クラスは、IE7から対応しているためよく使われる擬似クラスですよね、何度も使っていたにもかかわらず勘違いしたので戒めとして書き記しておきます。

:first-child擬似クラスは、親要素の一番 ...

2017-10-05CSS

Thumbnail of post image 164

レスポンシブデザイン時のテーブルレイアウトの一つの参考。

600px以下で表示したときには、セルの幅が狭くなり過ぎて見づらくなるのを解消するため、横スクロールさせる。

幅600pxのテーブル

見出しA見出 ...