デザイナーのタネあかし

<table>テーブルタグのサンプルコードです。HTMLコーディングする際のベースとしてご活用ください。 サンプルコード サンプルの表示イメージです。 HTML <table class="fgr-table"> <thead> <tr> <th col....続きを読む

サイトトップページなどのスライダー部分で利用されている、レスポンシブ対応のjQueryプラグイン「bxSlider」について調べたことを健忘録としてまとめておきまうす。 bxSlider公式サイトはこちら 使用例やオプションの設定方法など、わかりやすくまとめ....続きを読む

jQueryを利用してスムーズスクロールを導入した際、タブナビゲーションを利用しているページでタブ切り替えが出来なくなりました。今回はその解決方法をご紹介します。導入しているスムーズスクロール$(document).ready(function () { //スムーズスクロ....続きを読む

Bootstrap を利用してwebサイトを構築した時、ページをプリントアウトするとリンクの箇所に意図していないのにURLが記載されていて驚いてしまいました。ブラウザのプリント設定？それともほかの？・・・と調べてみたところBootstrap が原因でした。Bootst....続きを読む

Bootstrap 3.3.4 でサイトを構築後、スマホ・タブレットで表示確認していたところ、Dropdowns （ドロップダウンメニュー）の挙動がおかしいのを発見しました。複数のDropdownを設定しているドロップダウンメニューAをタップして開く次にドロップダウンメ....続きを読む

IE6～9にCSS3を反映させるため、 PIE　http://css3pie.com/　を利用されている方も多いのではないでしょうか。 今回はそのPIEを用いて透過する背景（色）の設定方法をご紹介します。 ドロップシャドウと併用できないデメリットがありますが、デザイン....続きを読む

Bootstrap3なら簡単にアイコンフォントを使うことができますが、残念ながらIE７には正式には対応していません。そこでアイコン表示をIE７に対応させる方法をご紹介します。BootstrapアイコンフォントGlyphiconsの表示方法通常の使い方はこうです。アイコ....続きを読む

サイトデザインをしていると、稀にクライアントから「ご挨拶は明朝体にできませんか。」と相談されることがありませんか？そんな時は Microsoft OFFICE（以下 MS Office ）の付属フォントをCSS指定してはいかがでしょうか。ちなみに 「ご挨拶」でgoogle画....続きを読む

IE7 に対応させるためにコーディングを行っていたことろ、ドロップダウンが下のブロックレベル要素に潜り込んでしまう事象が発生していました。他の主要ブラウザでは起きておらず、IE7だけの現象でした。改めて調べたものをまとめておきます。どんな問題....続きを読む