Attribute selector
One of the most important
selector is attribute selector.
Every element they can
use attribute (id,class,alt all are attribute) as project requirement,developer
can select this attribute and manipulate the HTML element using CSS.
What is attribute selector?
Attribute selector is used to select elements using their present
uses attribute.
We can select Element using there attribute, whatever
attribute they contain it doesn’t matter.
Example.
In your project there you use three <img> element some
of them uses alt attribute .
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
img[alt]{
border:3px solid red;
}
p[id]{
color:red;
font-size:50px;
}
h1[class]{
color:#4800ff;
}
</style>
</head>
<body>
<h1 class="head">Heading</h1>
<img src="pic1.gif" alt="tajmahal" />
<img src="pic1.gif" />
<img src="pic1.gif" alt="SoL" />
<p id="#">TTN</p>
</body>
When we use img[alt] it select <img>
element which having alt attribute,
In above Example there are three <img> element, 1st
and 3rd <img> element
contain alt attribute.When you run
the program then 1st and 3rd <img> element showing image with
border.
also one <p> and one <h1> tag there after running they are also affected by the css code.
also
OutPut:
Download the Project
No comments:
Post a Comment