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

CSSを使用したセレクターのテキストの最初の行に特別なスタイルを追加するために使用される要素

：最初の行を使用します ドキュメントの要素の最初の行に特殊効果を追加する要素。

例

次のコードを実行して、テキストの最初の行に特別なスタイルを追加してみてください

<html>
   <head>
      <style>
         p:first-line {
            text-decoration: underline;
         }
         p.noline:first-line {
            text-decoration: none;
         }
      </style>
   </head>
   <body>
      <p class = "noline"> This line would not have any underline because this belongs to nline class.</p>
      <p>The first line of this paragraph will be underlined as defined in the CSS rule above. Rest of the
      lines in this paragraph will remain normal. This example shows how to use :first-line pseduo element
      to give effect to the first line of any HTML element.</p>
   </body>
</html>

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

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

  2. CSSを使用して要素のテキストの色を設定する

    CSSのcolorプロパティは、要素のテキストの色を変更するために使用されます。値は、標準の色名、rgb（）、rgba（）、hsl（）、hsla（）、および16進値として指定できます。 構文 CSScolorプロパティの構文は次のとおりです- Selector {    color: /*value*/ } 次の例は、CSSカラープロパティ-を示しています。 例 <!DOCTYPE html> <html> <head> <style> div {    height: 50px;   &nb