2:54 PM
Oglacs
Adjacent Sibling Selectors
These selectors allow the selection of specific elements that come directly after another specific element. However, the elements are of the same level in the element hierarchy. In the following rule, you will be able to select all p elements that comes immediately after h2 elements but not other p elements.
h2 + p {
...
}
(Note: Adjacent Sibling selectors are not supported in IE 6 and below)
Pseudo-Classes
These classes are used to provide styles to various states of elements. Its most common usage is in styling links states. Examples are given below:
:link—the default state of links.
:visited—links already visited in the browser.
:focus—links that currently have the keyboard cursor within them.
:hover—links that are currently being hovered over by the mouse pointer.
:active—a link that is currently being clicked on.
According to the following rule the default links will be blue. The underlining under the link will disappear when hovered over. In order to make the same effect take place when links are focused via the keyboard, :hover rule is duplicated with :focus. If a link is already visited, the color of the link will turn gray and finally, when a link is active, it is emboldened.
a:link {
color: blue;
}
a:visited {
color: gray;
}
a:hover, a:focus {
text-decoration: none;
}
a:active {
font-weight: bold;
}
Note that the above specified rules should be in the same order. It may not work otherwise. This is because specificity of a rule in a style sheet may override the earlier rules. You will come to know more about it later.
The :focus pseudo-class also comes in handy as a usability aid in forms. For instance, we can highlight the input field that has the active blinking cursor with a rule like given below:
input:focus {
border: 2px solid black;
background color: lightgray;
}
Now, lets have a look at :first-child. This pseudo-class selects any instance of the element that is first child element of its parent. As given in the example below, the rule selects the first list item in any list and makes its text bold.
li:first-child {
font-weight: bold;
}
Last but not the least, lets look at :lang pseudo-class. This class selects elements whose languages have been set to a specified language using the lang attribute. An example is given below.
<p lang="en-US">A paragraph of American text, gee whiz!<p>
Could be selected using the following:
p:lang((en-US) {
...
}
Come back for more CSS tips. Visit Oglacs software development company for more.
Posted in: 
1 comments:
Princess Square in Koramangala - Serviced Apartments in Bangalore
With over 40 years of experience in the Service Industry all of us at princess square Service Apartments personally know caring for the guest and It is our goal to make sure you, your family and friends the guest enjoy a carefree vacation or Superior business class experience.
We have a small quality driven collection of hotels & hotel apartments within one of the world's most modern and fastest growing city of Bangalore.
Welcome to the Garden city - Welcome to Princess square Service Apartments Hospitality, where our promise of pure value, pure quality and pure service is delivered.
An essential attribute of all our properties are our convenience and central locations within the city of Bangalore.
At princess square Service Apartments we provide a wonderful choice. Whether you are a discerning budget traveler or just looking for that element of luxury of a 5 star business hotel, we have the accommodation solution to suite you.
Our deluxe hotel apartments offer a choice of both full hotel service operations as well as self catering facilities. We have an extensive choice of accommodations to choose from and our portfolio includes standard hotel rooms, deluxe hotel suites, studios, One, Two & Three Bedroom suite apartments, Royal Suites, Executive & Privilege Floors.
We are ideal for leisure, corporate travelers, stopovers & long stays.
All our hospitality establishments provide only the highest levels of comfortable quality accommodations and we are the perfect choice for your next city break, business meeting or special family occasion.
Post a Comment