• Problems

    This line enable URL Rewriting . It must be enabled via the RewriteEngine directive! and if your .htaccess file is going to use rewrite rules, you should always include this line. Otherwise, you can’t be sure if its enabled or not. The string “on” is case insensitive.


You must read part One Of this Article to understand below article Read Part One
css pseudo class element

1] Pseudo-element

syntax: Tag::pseudo-element
Use: Style targeted text and place fake element before and after tag
1
Pseudo element is divided into three type based on the Targeting :
  • Tag:first-line -Style first line of paragraph
  • Tag:last-letter -style first letter of paragraph
  • Tag:selection -style selected text

<div> First child

</div>

 style:
div:first-letter{color:red;} 


2
Pseudo class is divided into two type based on the placing tags :
  • Tag::before
  • Tag::after
Basic Syntax
        
<div>
first child first type

 </div>
style:
    div:before {
   content: "before";
}

div:after {
   content: "after";
}

Some Notes On The Syntax

You could leave the content property empty and just treat the pseudo-element like a content-less box, like this:
#example:before {
   content: "";
   display: block;
   width: 100px;
   height: 100px;
}
However, you can’t remove the content property altogether. If you did, the pseudo-element wouldn’t work. At the very least, the content property needs empty quotes as its value.

One final point regarding the syntax. Technically, you could implement a pseudo-element universally, without targeting any element, like this:
:before {
   content: "#";
}
While the above is valid, it’s pretty useless. The code will insert a hash symbol before the content in each element in the DOM. Even if you removed the <body> tag and all of its content, you’d still see two hash symbols on the page: one in the <html> element, and one in the <body> tag, which the browser automatically constructs.
  • Why to use ::before and ::after
  • Important to write nested tags
  • Used when you want to add less tags to your Html document
  • Notice about ::before and ::after
  • Display content within the tags not outside
  • Your content get effect of parent tags but You can also style content individually

No comments:

Post a Comment