[CSS] iPhoneのSafariでタップした際に表示される暗めな影を消すCSS - YoheiM .NET
こんにちは、@yoheiMuneです。 iPhoneのSafariでリンクとかボタンとかをタップした際に、一瞬だけ半透明の黒い背景が出る現象。 この黒半透明を出させないCSSの設定を学んだので、ブログで紹介したいと思います。 タップした際にでる黒い半透明な背景とは 具体的には、以下のようなモノです。 これってタップした感覚が出るので嬉しい反面、タップ時のスタイル（:activeとかで指定）がある場合には、 出てこないで欲しい場合もあります。 黒い半透明な背景を変更するCSS 以下のCSSを用いることで、リンクやボタンのタップ時の色を変更することが出来ます。 -webkit-tap-highlight-color:rgba(0,0,0,0); 上記の例だと、完全透明にして、タップ時に黒い半透明な背景を表示しないようになります。 rgbaの値を変更することで、他の色を設定する事も可能です。 な
![[CSS] iPhoneのSafariでタップした際に表示される暗めな影を消すCSS - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/46f21185e2f69fa6016680a0a1bdb4495ba2fbd7/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F131.png)
Ace - The High Performance Code Editor for the Web
Built for Code Ace is an embeddable code editor written in JavaScript. It matches the features and performance of native editors such as Sublime, Vim and TextMate. It can be easily embedded in any web page and JavaScript application. Ace is maintained as the primary editor for Cloud9 IDE and is the successor of the Mozilla Skywriter (Bespin) project. /** * In fact, you're looking at ACE right now.
Androidと-webkit-tap-highlight-color
Androidと-webkit-tap-highlight-color Androidと-webkit-tap-highlight-colorの関係がよくわからず色々と悩んでいたのですが、ひと通りの結論が出たので紹介します。 そもそも-webkit-tap-highlight-colorってなによ iPhoneなどのスマートフォンでa要素をタップしたときにハイライトさせるプロパティです。ハイライトと言ってもiPhoneの場合は半透明のグレーのレイヤーが表示されるのですが。 サンプル このレイヤーの色を-webkit-tap-highlight-colorで制御することが可能です。 a { -webkit-tap-highlight-color: rgba(0,0,215,0.40); } このようにするとハイライトカラーが半透明な青色に変わります。 サンプル ただし、このように指定してもA
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
