会話風吹き出しのテンプレートとして使えるCSSを作ってみました。 会話風吹き出しのデザインは一見難しそうに見えるのですが、要点さえ抑えてしまえば誰でも簡単に作ることができます。 例えば・・・ ブログの中で会話してるみたいな吹き出しが作りたいんだよね。 うんうん！LINEみたいな会話調のブログって読みやすいよね。 CSSでできるみたいなんだけど、結構難しそうなんだよね・・・ それが、実はそんなに難し […]
positionを使うとfloatやmarginを駆使してレイアウトを設定するより簡単に設定できてしまうのですが、1つ難しいところがありますね。 そう。 【position: absolute;】で配置を設定するときの基準がわかりにくいのです。 大体は疑似要素（after、before）と一緒に使われていたりするので、結構理解に苦しむ部分です。 今回はそんな【position: absolute […]
ブログのカスタマイズをするとき、必要なアイコンをいちいち画像化して、フォルダにアップロードするのは手間ですね。 そんなときは「Font Awesome」というアイコンを文字（フォント）として利用できるサービスを導入すると便利です。 例えば、箇条書き（リスト）の頭出しに「」を利用するということもできます。 導入の手順：2ステップでサクッと導入 「Font Awesome」からウェブフォントの埋め込み […]
WordPressをカスタマイズするときに使うと便利なのが「子テーマ」です。 子テーマとはベースとなるテーマのCSSやPHPファイルを引き継いで、部分的にカスタマイズを反映させるためのテーマのコピーのことだと思うとわかりやすいかと思います。 子テーマを作っておくと オリジナルのテーマを壊してしまう心配がない 必要な箇所の記述だけを加えればOK とすごく便利です。 また親テーマのアップデートがあって […]
WordPressテーマを作ったり、ホームページを作ったりするとき、間違いなく登場するのはCSS（カスケードスタイルシート）です。 CSSはホームページやブログのデザインを設定しますが、IDでもclassでもCSS上は全く同じようにビジュアルを設定できてしまいます。 ですが、この2つには明確に違いがあるので、正しく使い分ける必要があります。
先日ふと思い立って、一からWEBサイトをデザインし始めることにしたのですが、一からと言うのはなかなか難しいですね。 基本も忘れかけていたのでちょっとずつメモしていこうと思います。 私自身リキッドレイアウトやレスポンシブ対応など、ちゃんと勉強したことがありませんでした。 ですから、HTMLとCSSは読めば分かる程度の知識しかありません。 同じレベルの人には調度よい難易度？かもしれません。
google-code-prettifyとはウェブページ上のソースコードを自動的に色付けして、読み易く編集してくれるGoogleのシンタクスハイライト機能です。 導入した後は、<pre class=”prettyprint”></pre>でソースコードを挟むだけで、ハイライト機能が使えるようになります。
HTML・CSS・PHPなどのウェブ系の言語をどれくらい理解しているでしょうか？ 「全然わかりません」という人でも、WordPressなどのCMSでテーマを探して利用している人は多いと思います。 自分好みの既存のテーマを探したりするのは面倒 この部分だけカスタマイズしたいんだけどな レイアウトを少しいじりたいな 既存のテーマで満足できるうちはいいのですが、こんな不満があるのならこのサイトで勉強して […]
