kathewのブックマーク - はてなブックマーク

JS/jQueryでCSS疑似要素である:before:afterのプロパティを取得し変更する | ITハット
JS/jQueryでCSS疑似要素である:before:afterのプロパティを取得し変更する jQueryにはCSSのプロパティを取得できる css() という関数がありますが、残念ながら疑似要素には対応していません。サンプル要素 .pseudo::before { content: '疑似要素取得'; } 今回はこの要素の content の値を取得・変更していきます。取得する var property = window.getComputedStyle($('.pseudo')[0], '::before').getPropertyValue('content'); console.log(property); // 疑似要素取得 JSの関数を使って疑似要素のプロパティを取得することができます。 getComputedStyle() 関数の第二引数に ::before または :
kathew 2018/01/30
jquery

javascript

tips
リンク
CSSでplaceholderの文字色などのスタイルをカスタマイズする | ITハット
よく検索ボックスでキーワードを入力という文言を目にしたことがあると思います。これがplaceholderです。デフォルトでは、灰色をしていますが、このように紫色に変えたりすることができます。 placeholderのスタイル /* Chrome, Safari 5+, Opera 15+, iOS, Android */ ::-webkit-input-placeholder { color: #4527A0; } /* Firefox 18- */ :-moz-placeholder { color: #4527A0; opacity: 1; } /* Firefox 19+ */ ::-moz-placeholder { color: #4527A0; opacity: 1; } /* IE 10+ */ :-ms-input-placeholder { color: #4527A0;
kathew 2017/11/27
css

web

design
リンク
CSSの擬似要素:beforeや:afterのcontent内の任意の位置で改行する | ITハット
CSSの擬似要素:beforeや:afterのcontent内の任意の位置で改行する CSSの擬似要素はとても便利ですよね。タグの数をかなり減らせることができてソースコードが見やすくなります。擬似要素を使う際、content 内で改行できたらなと思ったことはないでしょうか。実は改行することはできるのです。その方法を紹介したいと思います。擬似要素内で改行する
kathew 2017/04/04
css

tips

web

development

design
リンク
1