CSS

CSS(カスケーディング・スタイル・シート)について紹介します。

CSS

アクセシビリティを無視してtableのスマホ表示対応

tableのスマホ表示は「ScrollHint」が総合的に良きと思っているのですが、時と場合によっては導入が手間だったり、システムの関係で使えないという事もあると思います。 そんな時に、やむをえず対応したtableのスマホ表示の忘備...
CSS

safariとかで画像が下に伸びる現象が起きたらflexboxを見直すんだ

コーディングには必要不可欠なぐらい多様しまくってるflexbox。昔のようにfloatをいっぱい使っていた頃には、もう戻れないよ。 そんなflexbox、safariブラウザで確認すると画像が伸びる場合があります。
2020.08.05
CSS

テーブルを並べ替えソートする便利なライブラリ「tablesorter」のカスタマイズ

テーブルの一覧をクリックで並び替えソートしてくれる「tablesorter」。簡単設置で、本当に便利な便利なライブラリの簡単なカスタマイズ方法。
CSS

inputタグのcheckboxとradioボタンでできる事まとめ

フォームの中の選択項目として利用するinputタグのcheckboxとradioボタン。どちらも選択肢を選ぶ目的で古(いにしえ)から伝わる方法です。 そんなcheckboxとradioボタンを使い、JavaScriptなどは使わずに...
CSS

アクセシビリティを考えてinputタグのcheckboxをボタン化する

inputタグのcheckboxを使いやすくする為にCSSで装飾する事、あると思います。押しやすくしたり、視認性を高めたり、操作性を向上させる事は良い事ですが、引き換えにアクセシビリティが損なわれる事もあります。 この記事ではそのア...
CSS

【ワードプレステーマ】CocoonでSANGOみたいな切り替えタブを実装する

トップページを固定ページに変更してから数週間経って、ずーっと「これでいっか」感があり、前からいいなぁと思っていたSANGOの切り替えタブを実装。その実装したトップページのテンプレートファイルを紹介。
2020.01.27
CSS

ページ遷移時にアニメーションを入れる方法【ライブラリなし】

次のページに進む際、トップに戻る際、ページ遷移時にアニメーションがあると、サイトの印象はかなり強くなりますよね。
2019.12.06
CSS

CSSだけで新着記事を流れるテキストのヘッドライン表示にする

流れるテキストで目立たせて、新着記事等をJavaScript等を使わずCSSだけで表示させる方法を、紹介します。
CSS

CSSをminify化(ファイル圧縮)する際のCSSアニメーションの注意点

CSSをminify化(ファイル圧縮)した際、CSSアニメーションが動かないという事があり、原因を調べてみました。圧縮する際のエラーかなと思っていたのですが、エラーというよりはCSSの書き方に注意が必要でした。
CSS

ヘッダーを固定したサイトのページ内リンクのズレを考える

ヘッダーやメニューバーを上部に固定させるサイトデザインは世の中に溢れています。 ページスクロールの解説記事もたくさん溢れています。 ただ、position:fixedなどでヘッダを固定した際のズレの事、考えた事ありますか?
2019.12.09
タイトルとURLをコピーしました