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

CSSの使用法：最初の行の疑似要素

この要素を使用して、セレクターのテキストの最初の行に特別なスタイルを追加します。次の例は、：first-line要素を使用して、ドキュメントの要素の最初の行に特殊効果を追加する方法を示しています。

例 

<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要素タイプセレクターの構文は次のとおりです 構文 element {    /*declarations*/ } 例 次の例は、CSS要素タイプセレクターを示しています <!DOCTYPE html> <html> <head> <style> li {    list-style: none;    margin: 5px;    border-bottom-style: do

  2. CSSの疑似要素とは何ですか

    CSS疑似要素は、基本的に、最初の文字、最初の行など、要素の特定の部分のセレクターです。：afterおよび：before疑似要素を使用して、要素の前後にそれぞれ挿入できます。 構文 以下は、要素でCSS疑似要素を使用するための構文です- Selector::pseudo-element {    css-property: /*value*/; } 例 CSS疑似要素の例を見てみましょう- <!DOCTYPE html> <html> <head> <style> ol, ul {    list-st