サイト構築
知っておくと便利で役に立つHTMLの属性のまとめ
Post on:2021年10月21日
あまり知られていないけど、知っておくと便利で役に立つHTMLの属性を7つ紹介します。 Google翻訳が翻訳しようとするのを防ぐtranslate属性、リンクをダウンロードするように指示するdownload属性、アップロ […]
Tailwind CSSの入門に!コピペで簡単に利用できるUIコンポーネントのまとめ
Post on:2021年10月20日
Webサイトやスマホアプリで見かけるUIコンポーネントをTailwind CSSで実装されたコンポーネント集を紹介します。 Tailwind CSSを初めて触れる人にも簡単で、デフォルト構成で機能し、HTMLをコピペする […]
Figmaでデザインする時に作業効率がアップする便利なテクニックのまとめ
Post on:2021年10月19日
私の周りでも、Figmaを使用する人がだいぶ増えてきました。 Figmaでデザインする時に役立つ、便利なテクニックを紹介します。Figmaでの日常的な作業から、デザインシステムや巨大なデザインファイルを扱う場合に作業効率 […]
レスポンシブ対応にメディアクエリなしで、CSSの関数で定義!border-radiusの値を変えるテクニック
Post on:2021年10月14日
border-radiusの値をデスクトップとスマホで変える、例えばビューポートが大きくてマージンがある場合は8pxで角丸にし、ビューポートが小さくてマージンがない場合は0pxで矩形にする。 メディアクエリで簡単に実装で […]
CSSのaspect-ratioプロパティがすべてのブラウザにサポートされました、画像をアスペクト比で実装する今までとこれからの実装方法
Post on:2021年10月13日
先日アップデートされたSafari 15とSamsung Internet 15により、すべてのエバーグリーンブラウザでaspect-ratioプロパティがサポートされました。 ※エバーグリーンとは、最新版に自動アップデ […]
Vue.jsで再利用可能なタブのUIコンポーネントを実装する方法を解説
Post on:2021年10月12日
タブは、Webサイトやスマホアプリでよく使用されるUIコンポーネントです。TailwindCSSやBootstrapなどのライブラリにも必ずありますが、再利用可能な柔軟性のあるものではありません。 スタイルを簡単にカスタ […]
Windows 11をインストールせずに、UIを試せる!Reactで実装されたWindows 11
Post on:2021年10月11日
Windows 11を試したいけど、インストールはしたくない、そんな人にUIを手軽に試せるReactで実装されたWindows 11を紹介します。 Windows 11 in ReactはブラウザでWindowsのUIが […]
CSSの新しい単位がすごく便利!コンテナベースの相対単位「コンテナ単位(qw, qh)」の基礎知識と使い方
Post on:2021年10月7日
CSSでよく使用する単位といえば、px, em, remをはじめ、最近ではvh, vwなどだと思います。特にレスポンシブ対応のレイアウト・コンポーネントを実装する時には、ビューポート相対単位のvh, vwが非常に便利です […]
Web制作者・デベロッパー向け、ポートフォリオ用のHTMLテンプレート -Dopefolio
Post on:2021年10月6日
Web制作者・デベロッパー向け、ポートフォリオ用のテンプレートを紹介します。 オープンソースで、HTML, CSS, JavaScript, Sassで実装されており、フレームワーク・ライブラリは必要ありません。自己紹介 […]
このCSSなら簡単!フォームのチェックボックス・ラジオボタンとテキストをベースラインに揃えて配置
Post on:2021年10月5日
フォームの実装で面倒なのがフォーム要素とテキストを揃える、特にチェックボックス・ラジオボタンとテキストをベースラインに揃えることです。 flexboxでalign-item: baseline;を使用すると、チェックボッ […]
sponsors








