CSStab-sizeプロパティを使用したHTMLでのタブサイズの設定
CSSタブサイズプロパティ タブで使用される空白の量を設定できます。次の例は、CSSのtab-sizeプロパティを示しています。
例
<!DOCTYPE html> <html> <head> <style> body { display: flex; flex-direction: column; } p { white-space: pre; } p:last-of-type { tab-size: 32; -moz-tab-size: 32; } </style> </head> <body> <p> Ut sed felis lobortis, fermentum magna vitae, imperdiet lectus.</p> <p> Ut sed felis lobortis, fermentum magna vitae, imperdiet lectus.</p> </body> </html>
出力
これにより、次の結果が生成されます-
例
<!DOCTYPE html> <html> <head> <style> pre { margin: 2%; box-shadow: inset 0 0 12px lime; } p { background: lavender; tab-size: 1; -moz-tab-size: 1; } </style> </head> <body> <pre> 4 tabs of size 1 paragraph .|.|.|. <p> Ut sed felis lobortis, fermentum magna vitae, imperdiet lectus. </p> </pre> </body> </html>
出力
これにより、次の結果が生成されます-
-
CSSの外観プロパティを持つカスタムチェックボックス
外観プロパティを使用して、ユーザーのオペレーティングシステムのプラットフォームネイティブスタイルに従って要素のスタイルを設定します。 構文 CSSの外観プロパティの構文は次のとおりです- Selector { appearance: /*value*/; -webkit-appearance: /*value*/; /*for Safari and Chrome */ -moz-appearance: /*value*/; /*for Firefox */ } 例 次の例は、CSSの外観プロパティを示しています。
-
CSSの文字間隔プロパティを使用して文字間にスペースを設定する
CSSの文字間隔プロパティを使用して、テキストの文字間のスペースの量を指定できます。 例 次の例は、CSSの文字間隔プロパティを示しています。 <!DOCTYPE html> <html> <head> <style> p:first-of-type { margin: 3%; padding: 3%; background-color: seagreen; color: white; letter-spacing: