CSS は強力で柔軟なスタイル シート言語であり、Web デザインにおける HTML や XML などのマークアップ言語の視覚的プレゼンテーションに特に使用され、Web ページのプレゼンテーションをより美しく、きちんとし、インタラクティブなものにします。ただし、CSS プロパティ モジュールには数百の標準化されたプロパティ名がありますが、不明なプロパティ名もまだ多くあります。
そこで、この記事では、あまり知られていない CSS プロパティ名をいくつか紹介し、これらのプロパティ名の特徴と適用シナリオを 1 つずつ明らかにしていきます。
まず、デフォルトの動作は自動であり、ユーザーがスクロール境界に到達すると、タッチ デバイスはデフォルトのスクロール操作を実行します。 「含む」は、スクロール領域のオーバーフローを禁止し、貫通スクロール動作を保持します。つまり、ユーザーがデバイスにタッチしてスクロール境界に達すると、ページの背景要素がスクロールできるようになります。 none 属性はページ全体のスクロール動作を無効にし、unset は要素の親要素の属性値を使用します。
clip-path 属性は、クリップ パス関数を定義します。この関数は、URL (SVG ファイルを指す) として定義することも、ジオメトリを指定することもできます。特定の形状を指定する必要がある場合は、ellipse()、polygon()、inset() などの事前定義された形状から選択できます。
object-position を使用すると、要素内のマップされた画像の位置を調整できます。この属性を使用して、オブジェクトがデフォルトで表示される位置を指定します。通常、この属性は、マッピングされたイメージの位置を調整する (つまりクリップする) ために、要素の width または height 属性と組み合わせて使用されます。
たとえば、2 つの要素の間にテキスト マスクを配置する場合、mix-blend-mode を使用していくつかの色を混合し、オーバーレイ操作を通じて特定の場所でそれらをユニークに見せることができます。この属性には、さまざまな属性値 (乗算、スクリーン、オーバーレイ、暗くする、明るくするなど) が含まれます。
通常、テキストはテキスト配置を使用して要素の境界に配置されます。ただし、テキストが別の行にはみ出した場合、最後の行のテキストの配置がテキスト ブロック全体の配置と異なる場合があります。このプロパティを使用すると、開発者は最終行のテキスト配置を指定できます。
shape-outside は、SVG パスに似た構文を通じて適応形状を指定する 4 つの形状関数をサポートします。これらの形状には、円、楕円、多角形、およびインセットが含まれます。
font-variant-ligatures 属性を使用すると、ブラウザーは特定のフォント形式を無視するグリフ置換を使用して、レンダリング効果を向上させることができます。この属性には、すべての半角グリフ置換、合字置換 (合字)、数字グリフ置換、句読点グリフ置換、および表音文字置換が含まれます。
概要
ここにリストされている 7 つの CSS プロパティ名は広く知られていませんが、だからといって役に立たないというわけではありません。実際、これらの属性名を知っておくと、Web ページの開発をより効率的に行うことができ、同時にページをより優れた完成度の高いものにすることができます。
将来的には、インターネット技術の発展と変化に伴い、新しい属性名が次々と登場するでしょう。したがって、私たちは時代の進歩に乗り、優秀なフロントエンドエンジニアになるために学び、挑戦し続ける必要があります。
以上があまり知られていない CSS プロパティ名について話しましょうの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
