【CSS】簡単に固定できるposition: sticky;の実装サンプル集
なにかと使える sticky！（スティッキーと読みます） 実装サンプル、ヘッダー（ナビにも使える） See the Pen 【CSS】position: sticky; – ver.01 by 125naro
...
【CSS】Flexboxの使い方と実装サンプル集
ふれっくすぼっくすってなんですかー 楽しく言うとちょっとしたコーディングダンスですー Flexboxの基本 親要素（コンテナ）があって子要素（アイテム）がある。入れ子とも呼ばれてたりします。親要素（コンテナ）がないとフレ
...
【CSS】スマホでリンクをタップした時に色を変える方法
スマホでタップ！ 色変わる！ 実装サンプル a要素に『ontouchstart』を追記して『a:active』に色を指定します。 実装サンプル（リンクじゃなくてもOK） さいごに ページ全部にできますかー？ ページ全部の
...
【CSS】背景画像を固定したおしゃれなLP（ランディングページ）を作ってみよう
ランディングページを作るのですか？ ちょっと作ってみましょうー 実装サンプル See the Pen 【CSS】Fixed background full (Responsive) by 125naroom (@125n
...
【CSS】レスポンシブ対応の三角形を作る
CSSで三角形を作ることは意外と簡単だったりします。では、レスポンシブな三角形ってどうでしょう？ あ、なるほど。と思ったので記事にしてみました。 うーん、『％』を使う！ ちがいまーす、『vw、vh』を使いまーす レスポン
...
【CSS】input、textareaのCSSを初期化する（iOS対策）
ちょっとメモですー よく忘れてしまうのでメモですー なぜ初期化？ iOS Safariではのフォーム要素（input,textarea）がデザイン通りにならないとこがあります。iOS Safariのデフォルトスタイルが優
...
LINE風の吹き出しの会話をCSSで作ってみる
CSSだけで、LINE風の吹き出しの会話を作ってみました。何かとよく使います。やはりレスポンシブにコーディングするのは難しいですね。シンプルに疑似要素の「:before」「:after」を使ってコーディングしています。角
...
【CSS】olのリストで①、②、③（丸数字）を表示させる
lのリストで①、②、③（丸数字）ってできますかー できますよー サンプル①、簡単バージョン See the Pen 【CSS】olのリストで①、②、③（丸数字）を表示させる、簡単バージョン by 125naroom (@
...
【CSS】背景（background）を2色にする
背景を2色ってできますか？ 『background』の『linear-gradient』をうまく使うとCSSだけでコーディングできますよー 半分、上と下 See the Pen CSSだけで、背景を2色にする、縦の半分こ
...
【CSS】吹き出しをつくる、三角の部分をちょっと曲げて素敵にする
今回は、吹き出しの三角の部分をちょっと曲げて素敵にしてみました。シンプルに三角だけなら簡単なのですが、「LINE風にしたい」というご要望がありまして。シンプルに疑似要素の「:before」「:after」を使って重ねるこ
...
【CSS】ホバー（マウスオーバー）実装サンプル集（画像の明度を上げる編）
ホバーってなんですか？ マウスオーバーともいいますねー opacity、一択だと思っていた 画像をホバー（マウスオーバー）すると光るやつ。ほんとは半透明にしてるだけだから透過して背景次第でなんだかなということがよくあった
...
【CSS】ローディングアニメーション実装サンプル集
ローディングアニメーション、待ち時間のあれですね。使えそうなものを随時追加してこうと思います。 ぐるぐるぐるぐるー ぐるぐるぐるぐるー サンプル さいごに 目が回りますねー 待ち時間は短いのがいいですねー
...
【CSS】css-doodle を使って雨を降らせてみる
雨だー css-doodleで雨を降らしてみますねー サンプル See the Pen <css-doodle> Rain by 125naroom (@125naroom) on CodePen. css-
...
【CSS】かわいいタグをつくる
タグのデザインどんなのがいいですかー いろいろ作ってみますねー サンプル さいごに おー また追加しますねー
...
【CSS】ホバーエフェクト実装サンプル集（画像編）
画像のホバーってできますか？ できますよー サンプル 使えそうなホバー（:hover）さん。画像編です。LP作成時に役立ちます。 See the Pen 【CSS】ホバーエフェクト実装サンプル集（画像編）- image
...
【CSS】IE11だけ表示崩れしたときのCSSハック
IE11だけ IE10以降 「*::-ms-backdrop, 」を外すとIE10以降に適用される。
...
【CSS】吹き出しをつくる
ふきだしー ふきだしー 吹き出し（下） See the Pen CSSだけで、ふきだしをつくる by 125naroom (@125naroom) on CodePen. HTML CSS 吹き出し（上） See the
...
【CSS】プラスとマイナスをつくる
プラスってCSSで作れますかー？ 作れますよー プラス マイナス わーい 疑似要素を使えば簡単ですよー
...
【CSS】ラインの下に三角をつくる
ラインの下に三角を作りたいのですよー おー、擬似要素で作ると簡単ですよー つくる さいごに できましたー よかったですー
...
【CSS】しましま（縞模様）をつくる
画像を使わずに、シマシマ模様を作ってみる。グラデーションを使うと簡単。いろいろな場面で使える。 サンプル 縦しましま（縦縞） See the Pen CSSだけで、しましま（縞模様）をつくる、縦しましま（縦縞） by 1
...
【CSS】ベンダープレフィックス 必要なもの不要なもの
ベンダープレフィックス。そろそろ必要ないかと。 ベンダープレフィックスの種類 ベンダープレフィックス不要 ※ アルファベット順※ 随時追加 ベンダープレフィックス必要 ※ アルファベット順※ 随時追加 必要か不要かを確認
...