Thumbnail of post image 084

カスタマイズ - CSS

とても興味深い記事なのですがイマイチ理解できず、kachibito.netさんの記事でやっと分かりました。 はじめに img には擬似要素が使えないって知ってま ...

Thumbnail of post image 095

2021年2月22日Web Fonts

源界明朝げんかいみんちょうと言うフォントに出会った瞬間に思い浮かんだのは、「LINKIN PARK」の 1stアルバム 。 LINKIN PARK × 源界明朝 ...

Thumbnail of post image 180

カスタマイズ - CSS

お気付きかと思いますが、トップページのエントリータイトルと記事のタイトルにCSS Houdini「Confetti(紙吹雪)と Multiple underli ...

Thumbnail of post image 144

2020年10月19日カスタマイズ - HTML

details要素、summary要素は、HTML5から新たに追加された要素です。 details要素は、ユーザーが表示、非表示を切り替えられるコンテンツを設置 ...

Thumbnail of post image 019

Block Editor

最近、記事にギャラリーブロックをよく使うようになって気付いた事があります。 何か左に隙間があると言うか、もしかして右に寄ってる? 特にモバイルだと顕著に現れる。 ...

Thumbnail of post image 111

カスタマイズ - CSS

user-select: all; を使うと、1クリックで全選択できるようになります。ただし、オートコピーとかまではできません。 all はSafariでは動作 ...

Thumbnail of post image 138

カスタマイズ - CSS

CSS カウンターで、 ページ内の見出し番号を 自動的に振ってみます。 以下の例では 見出し h5 に番号を振っています。 .post { counter-re ...

Thumbnail of post image 072

カスタマイズ - CSS

pure css で円グラフを作成できることをご存知ですか! conic-gradient を使って実現してみましょう。 conic-gradient() ...

Thumbnail of post image 045

2019年9月28日カスタマイズ - Luxeritas

カッコイイ Blur Menu を発見しました♪Blur Menu with CSS3 TransitionsかなりCoolです♪ 以下はExample 5です ...

Thumbnail of post image 142

Short Code

WordPress をお使いの方に 朗報です♪ HTML5 で追加された要素、 「meter と progress」を 先日の記事で ご紹介いたしましたが、 D ...

Thumbnail of post image 071

2019年9月21日カスタマイズ - HTML

非同期でスタイルシートを ロードする最も簡単な方法 と言う記事を見つけました。 The Simplest Way to Load CSS Asynchronou ...

Thumbnail of post image 074

2019年9月7日カスタマイズ - CSS

@supports と CSS Hackについて 調べてみました。 @supports CSSの@supportsは機能クエリと呼ばれ、 CSSの特定のプロパテ ...

Thumbnail of post image 152

2019年9月5日カスタマイズ - CSS

CoolなSVGの hrを発見したので ご紹介いたします。 HTML の <hr> 要素は、段落レベルの要素間において、テーマの意味的な区切りを表し ...

Thumbnail of post image 081

2019年9月3日カスタマイズ - CSS

新しいCSSプロパティで 下線のスタイルを設定してみました。 two new CSS properties text-underline-offset ...

Thumbnail of post image 072

2019年7月9日カスタマイズ - CSS

CSS の ::selection疑似要素は、ユーザーが (テキストをマウスでクリックやドラッグすることで) 選択した文書の一部にスタイルを適用します。 CSS ...

Thumbnail of post image 044

2019年7月11日カスタマイズ - CSS

リーダー (記号) をCSSで アニメーション表示します。 そもそも Loading みたいに使う物のようですが、 文章に使っても面白いかと思います。 CSSは ...

Thumbnail of post image 181

カスタマイズ - other

※ クリスマスソングが、 ストリーミング再生されます。 音量に注意して下さい。 クリスマス限定! CSSだけでブログに天使を 飛ばしてみましょう♪   ...

Thumbnail of post image 022

2019年7月11日カスタマイズ - other

ハロウィンにまだ間に合います! CSSだけでブログに魔女を 飛ばしてみましょう♪         CSSは以下のように書 ...

Thumbnail of post image 093

2019年7月11日カスタマイズ - CSS

テキストリンクのホバー時に アンダーラインをうにょうにょと 波のようにアニメーションさせる CSSのテクニックと 画像を使わずに アンダーラインを波線にする テ ...

Thumbnail of post image 186

2019年7月11日カスタマイズ - CSS

CodePenで見つけたアンダーラインを ご紹介します。 タイトルが気になって翻訳してみました。 How do I get a custom colored u ...