CSSのみで画像を使わずノートや便箋のような下線を引く方法 | コトダマウェブ
ここでは、ノートや便箋のような下線をスタイルシートのみで表現する方法について見ていきます。 実線バージョン まずは、実線が引かれたデザインを見てみましょう。 ボタンで表示を切り替えてご覧ください。 See the Pen css_note_underline01 by kenichi (@ken81) on CodePen. CSS .note{ background-image: linear-gradient( 180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 97%, #ddd 97%, #ddd 100% ); background-size:100% 2em; line-height:2; } .note p{ margin-bottom:2em; } ポイントとなるスタイルシートだけ抜粋してみました。作り方のポイントは、上から下にかけて（角度が18
WordPressでスラッグ名からIDを取得する方法。投稿・固定ページ・カテゴリ・タグ・タクソノミーごとの違いを整理。 | WEMO
投稿IDやカテゴリIDから、投稿やカテゴリの情報を取得することは多いと思うのですが、今回はそのためのIDをスラッグから取得する方法について。 というのも先日、カテゴリスラッグからIDを取得する必要があり、調べてみると「スラッグからIDを取得する方法」は、投稿・固定ページ・カテゴリ・タグ・カスタムタクソノミーでそれぞれ方法が異っていて、なかなかややこしかったのです。
【トリミング】足りない領域を一瞬で伸ばす方法「水平線編」【コンテンツに応じて拡大・縮小】| psgips - Part 3
変形から保護する領域が設定できたら、[ コンテンツに応じて拡大・縮小 ] で、不足領域を拡張する操作を行いましょう。
Appleデバイスでtransparentのグラデーションが黒くなる現象
初めまして。去年にネコメシにジョインしたシライシです。 html, cssをメインに時々jsを書くお仕事をしております。今後ともよろしくお願いいたします。 Tl;Dr Appleデバイスでtransparentのグラデーションが黒い transparentは黒 グラデーションの計算は乗算済みアルファ 解決策は色指定を明示的にすること グラデーションが黒っぽくなる さて、本題です。タイトルの通りの現象が起こりました。 MacやiOSのSafariで transparent からのグラデーションが黒くなる現象に遭遇しました。 コードで言うと、 background: linear-gradient(to right, transparent, #f00) のような指定の仕方です。 期待する動作は透明から赤へのグラデーションです。実際にChrome, Firefox, IE, Edgeのブラウザ
テキストボックスをおしゃれにするCSSスニペット10選。フォームのデザイン改善に。 | KodoCode
フォームのデザインをかっこよくするテキストボックスのCSSサンプルをまとめました。デザインが美しいウェブサイト・ブログが増えています。フォーム周りのデザインも趣向を凝らしたものが多く見受けられるようになりました。目を引くデザインの入力項目は利用者の興味を引き付けます。 本記事ではフォームの中でも「テキストボックス」に焦点を当て、おしゃれなCSSスニペットを一覧にしてみました。 テキストボックスは入力フォームの中でも基本のコントロールになりますので、デザインセットでのサンプルも掲載しております。 シンプルだが確実にテキストボックスの見栄えを良くするCSSデザイン例。テキストボックスにフォーカスすると、ラベルが上に移動するシンプルなデザイン。See the Pen Animated Textbox by Stefan C. (@stefcharle) on CodePen. よく見るタイプのデ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
