カテゴリー「CSS」の記事一覧

これ以上ないくらい簡単な例から学ぶ、レスポンシブwebデザインの作り方




そろそろレスポンシブWebデザインについて本腰でとりかかろう このブログはWebサービスに関する記事が中心のため「ほぼPCからのアクセスだろう」と踏んでいました。 当初は目算通り推移していたのですが、 … 続きを読む→

cssでfont-sizeを指定する際のpx、em、%の変換表




変換表で記述方法をサクッと統一 複数の人間でcssファイルを編集すると「フォントサイズの記述方法がバラバラに…」なんてことはよくあります。中には小数点第3位まで指定する猛者まで…。 気がついた時に統一 … 続きを読む→

PukiWikiにプラグインを使って、お問い合せフォームを設置




お問い合せフォーム用のプラグインpkwkmail.inc.phpを設置しました。 今回はPukiWikiにお問い合せフォームを設置します。設置するといってもプラグインが用意されているので、インストール … 続きを読む→

SyntaxHighlighterでConsolasを使うと日本語が文字化けする際の対処法




SyntaxHighlighter EvolvedとConsolas、サイズ14pxの組み合わせで豆腐文字がでます コードを見やすくハイライト表示してくれるSyntaxHighlighter。このサイ … 続きを読む→

ページ編集の手間を劇的に減らす、Custom Field Templateでカスタムフィールドを作る方法




カスタムフィールドを導入して余った時間はコンテンツの充実に振り向けよう 「同じフォーマットのページを作るのに、テーブルを毎回コピペをしている。」 「ページによって要素が変わって、いつの間にかフォーマッ … 続きを読む→

WordPressのコメント欄にある「次のHTML タグと属性が使えます」を消す方法




コメント欄の下にある、タグが使用できることを伝えるコメントを削除 この長い文章、誰か読みますか?w 「次のHTML タグと属性が使えます: <a href=”” titl … 続きを読む→

Internet Explorer 8で10pxのフォントが崩れる




正確には10~11pxあたりのフォントの表示の不具合だ。 文字が大きくなったり小さくなったり、ひどい時にはピクピク動く。 悪いことにパーセントで文字サイズを指定しても同じように不具合が表れる。 この不 … 続きを読む→

WordPressにSyntaxHighlighterを導入しよう




タグを見やすくカラフルに彩り、 専用エディターのように自動で色を付けたい そんな要望にバッチリ答えてくれるプラグイン「SyntaxHighlighter」ちゃんとWordPressように用意されていま … 続きを読む→

Another HTML-lint gatewayでPukiWikiをチェック




PukiWikiの構文をチェック さまざまなカスタマイズをした結果、「Another HTML-lint gateway」 でチェックをすると「-40点」という素晴らしい数字を叩き出した。 昔から「規 … 続きを読む→

PukiWikiでリンク画像を配置




リンクとして機能する画像張り込み トップページからアップしていただいた画像をクリックすると、各ページへ飛ぶ記述法が複雑になったので、忘れないように書き留めておく。 |[[&ref(アピストグラ … 続きを読む→

インターネットエクスプローラー6用にデザインを調整




2011年10月現在でもIE6の利用者がいる。 当サイトでも5%以下だがIE6で訪問してくださる方がいる。 フラグシップなデザインサイトなら仕方ないがアクアリウムに関する辞書としての機能を持たせる以上 … 続きを読む→

PukiWikiのファイルリストの変更




ページ一覧の出力を改造 「index.php?cmd=list」でファイルリストでページ一覧が表示されるが、よく仕様を読まずにCSSを編集したため、topというidがかぶってしまった。 そこで「lib … 続きを読む→

PukiWikiで複数行のコメントを挿入




コメントのカスタマイズ PukiWikiでページにコメントを貰う場合「#comment」が用意されているが、一行しかコメント出来なかったり、タイトルが付けられなかったり、名前がブランケットネームになる … 続きを読む→

PukiWikiで表をソートしたい




本家PukiWiki 1.4.7で表を作り、昇順・降順で並び替える。 plusバージョンではプラグインが使えるが、本家では改造が必要で非常に大変だった。さらにファイルのリンクが細切れで必要なファイルを … 続きを読む→

PukiWikiで表組みデザイン




テーブルレイアウトの限界 PukiWikiでは可能な限り簡単に誰でも編集できるようにしたいので、独自のプラグインや、独自の成形ルールなどは指定したくないのですが、どうしてもデフォルトの機能だけでは実現 … 続きを読む→

PukiWikiでテーブル要素の回り込みを解除




「floatclear.inc.php」なるものを制作した。 前回の更新で「淡水魚図鑑」のフォーマットが原因でテーブル要素が自動で回りこむ設定をしたが早速色々と不具合が出てきた。 本来であれば回り込み … 続きを読む→

PukiWikiでテーブルの回り込み




テーブルを回りこませた。 PukiWikiでテーブル内にテーブルを作ってページの幅に合わせて改行することは出来なさそうなので、以下のように表を回りこませる設定にした。 改行などで無理やりレイアウトも可 … 続きを読む→