CSS
 Computer >> コンピューター >  >> プログラミング >> CSS

CSSを使用して左の境界線の幅を設定します

左の境界線の幅を設定するには、 border-left-widthを使用します CSSのプロパティ。次のコードを実行して、 border-left-widthを実装してみてください。 プロパティ-

例

<!DOCTYPE html>
<html>
   <head>
      <style>
         p {
            border-style: dashed;
            border-left-width: 10px;
         }
      </style>
   </head>
   <body>
      <p>This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text.</p>
   </body>
</html>

出力

CSSを使用して左の境界線の幅を設定します


  1. CSSの::最初の行の疑似要素

    このCSS疑似要素は、要素のコンテンツの最初の行を選択します。ただし、テキストを含む幅が固定されていない場合、ウィンドウサイズに応じて行の長さが変わる可能性があります。 CSSの例を見てみましょう::最初の行の疑似要素- 例 <!DOCTYPE html> <html> <head> <style> p::first-line {    background-color: lightgreen;    color: white; } </style> </head> <bod

  2. CSSの@mediaAt-rules

    CSS @mediaルールは、単一のスタイルシートでさまざまなメディアタイプ（印刷、画面、すべてなど）にさまざまなスタイルを指定するために使用されます。通常、その後にメディアタイプのコンマ区切りリストと、ターゲットメディアのスタイルルールを含むCSS宣言ブロックが続きます。 構文 以下は構文です- @media not | only mediatype and (expressions) {    CSS-Code; }のみ 例 CSS@mediaルールの例を見てみましょう- <!DOCTYPE html> <html> <head>