前回以下の記事でも書いたHTMLテーブルのヘッダーを固定する方法 su3se.hatenablog.com こちらよりも簡単に実装できる方法がありました。 hp.vector.co.jp 参照 blog.apar.jp

Purgecssを使用して、開発ワークフロー中にCSSファイルを60％以上削減します。 medium.com

数行コピペするだけで実装可能 HTML <script src="https://cdn.jsdelivr.net/npm/darkmode-js@1.3.4/lib/darkmode-js.min.js"></script><script> new Darkmode().showWidget();</script> 参照 coliss.com darkmodejs.learn.uno github.com

DraggabillyとTweenMaxを使用したコンテンツプレビューを備えたドラッグ可能な画像ストリップレイアウト。 ※古いブラウザーではサポートされていない可能性のある最新のCSSプロパティを使用していることに注意してください。 github.com 参照 tympanus.net

HTML <div id="fixedTableArea"> <div id="topLeftArea"> <table id="topLeftTable" class="fixedTable"> <tbody> <tr> <td>column0</td> <td>column1</td> </tr> </tbody> </table> </div> <div id="topRightArea"> <table id="topRightTable" class="fixedTable"> <tbody><tr><td>column2</td><td>column3</td><td>column…</td></tr></tbody></table></div></div>

basic基本的なCSSグリッドコードを生成して、動的なレイアウトを作成します！ オフィシャルサイト cssgrid-generator.netlify.com Github github.com

アメブロのカスタマイズ CSSを追記 画像URLは絶対パスで入力 ※url(画像URL); ※かっこは消さないよ！ /* ヘッダー画像を設定する */.skin-bgHeader {background: no-repeat scroll center top;background-image: url(画像URL);}/* ヘッダーの高さを設定する *…

使い勝手がなかなか良いHTML5のテンプレート 参考になったのはこちらの記事「WEBデザインラボ」さんが公開してくれているテンプレートです。 これの３カラムバージョンをお借りしました。 表示サンプル

オープンソースのサーバーインストール型のオンラインエディタを基に導入してみました。今後カスタマイズしていきながら玄人仕様にしていく予定です （たぶんｗ気が向いたらカスタマイズしていきますｗｗｗ） これがあればHTMLが解らない方でもブロックをは…

はてなブログのダッシュボードもそうですだけど、左カラムでレスポンシブな無料テンプレートってなかなか無いんですね。 はてなブログのダッシュボード WordPressのダッシュボード 上段は細めのヘッダーが来て左カラムがサイドバーになっててメインコンテン…

サイトにアクセスしたときに処理待ちの間にアニメーションを流す処理「ローディングアニメーションを追加しました。 時々サイト読み込み中にこんなのが出るやつです。 自作したローディングアニメーションは簡単なGIF画像です。 参考にしたサイト こちらのサ…