スマホやPCでも
コンテンツが長い場合に右下に「トップへ戻るボタン」があると
いつも便利に感じます。
簡単サンプルを書きましたので是非利用してみて下さい。
css
CSSでブロック要素を横並び＆上下中央揃え
CSSでブロック要素を横並びにする方法に「float: left OR right」がありますが
floatを使うと、その要素内を上下中央揃えにする「vertical-align: middle」が効きません。
以下は横並びにして、かつ、上下中央揃えにする方法です。
奇数・偶数個でCSS分け
よくtableの行で奇数偶数で色分けするために使っている方法です。
スクロールバーのカスタマイズ
iOSでのSafariなどスクロールバーがデフォルトで表示されないブラウザがあります。
そんなブラウザでCSSで表示させ、カスタマイズもできてしまう方法を紹介します。
iOS・フォーム選択時の自動ズーム回避方法
iOSではフォームのinput・textarea・dropdownをフォーカスするとズームされることがあります。
これは各要素のfont-sizeが16px未満の場合起きる現象です。
以下は自動ズームを防ぐ方法です。
tableにoverflowを設定してもスクロールバーは表示されない
スクロールバーを表示させるCSSプロパティ「overflow」をtableタグに指定しても何も起きません。
tableにスクロールバーを表示させたい場合は以下の方法でないといけません。
背景だけを半透明にするCSSの書き方
半透明にするCSSのopacityプロパティは、背景だけでなく文字や画像まで半透明にしてしまいます。
背景だけ半透明にする方法は以下の通りです。
CSSだけで要素を点滅させる方法
CSSだけで文字だけでなく、画像やリンクを点滅させることができます。
bootstrap-datepickerの使い方
bootstrap-datepickerを使うとカレンダーから日付を入力できるようになります。