興味深い-webkit CSSプロパティ

WebKitがSPANタグの外観をボタンまたは入力フィールドに変更できることがわかっている場合、またはどのプロパティを使用して要素をタップしたときの要素の動作を指示できるかがわかっている場合は、ここにいません。



そのため、WebKitエンジンに固有の非常に興味深いプロパティがいくつかあります。 たとえば、プロパティがあります



-webkit-touch-callout


このプロパティを使用すると、リンクをタップアンドホールドしたときのブラウザーの動作を指定できます。 デフォルトでは、リンクに関する情報を含むブラウザウィンドウがポップアップします。 デフォルトでは、このプロパティはdefaultに設定されていますがnoneに設定して情報がウィンドウに表示されません。



a.js-only { -webkit-touch-callout: none; }
      
      







このプロパティは、JavaScript / AJAXがリンクにハングしている場合に役立ちます。



-webkit-user-drag


このプロパティは、ブロックのドラッグ中に、ブロック自体が移動する必要があり、ブロック内のコンテンツは移動しないことを示します。



 /*    */ .content p.noDrag { -webkit-user-drag: none; } /*        */ .sidebar div.elDrag { -webkit-user-drag: element; }
      
      







-webkit-appearance


このプロパティを要素に設定することにより、SPAN要素の外観を決定できます。 たとえば、ラジオボタンのように:



 span.lookLikeRadio { -webkit-appearance: radio; }
      
      







または、テキストエリアとして:



 span.lookLikeTextarea { -webkit-appearance: textarea; }
      
      







このような値は約50個あります。リスト全体はここにあります



-webkit-text-security


パスワードを入力するときにマスクを変更できることがわかりました。 たとえば、円の代わりに、正方形を表示できます。



 input[type="password"] { -webkit-text-security: square; }
      
      







-webkit-user-select


ユーザーが要素内で選択できるものを決定します。



 div { -webkit-user-select: none; }
      
      







以上です。 この記事の無料翻訳でした。



UPD プロパティ-webkit-touch-calloutで絞り込みます。



All Articles