Eliya Tamil Css

2
CSS
www.kaniyam.com
Cascading Style Sheets

.
, CSS .
, .
""
, 2012 . CSS

.
, editor@kaniyam.com
.
http://kaniyam.com/learn-css-in-tamil-ebook

.
.
, .

.
.
tshrinivasan@gmail.com
editor@kaniyam.com
www.kaniyam.com
CSS
2016
2016 .
- . - nithyadurai87@gmail.com
: . - tshrinivasan@gmail.com
: .
- - socrates1857@gmail.com
.
,
.
.
.
, , www.kaniyam.com
.
. .
:
http://static.kaniyam.com/ebooks/learn-css-in-tamil/learn-css-in-tamil.odt
www.kaniyam.com
This work is licensed under a Creative Commons Attribution-ShareAlike

4.0 Unported License.
www.kaniyam.com

http://www.csszengarden.com
. CSS

.
CSS
.
.
, ''
,
.

,
, .
,
, FreeTamilEbooks.com ,
.
www.kaniyam.com
.
,
.
3 2015
: nithyadurai87@gmail.com
: http://nithyashrinivasan.wordpress.com
www.kaniyam.com
1 Cascading Style Sheets....................................................................................10

1.1 HTML without CSS.........................................................................................11
1.2 Internal style sheet.......................................................................................13
1.3 External style sheet......................................................................................15
1.4 Inline style sheet............................................................................................17
1.5 Multiple style sheet.......................................................................................18
2 Text.............................................................................................................................. 22
3 Font..............................................................................................................................25
4 Links............................................................................................................................ 27
5 Lists............................................................................................................................. 29
6 Tables..........................................................................................................................33
7 Divisions....................................................................................................................36
8 Body background.................................................................................................40
9 Positioning............................................................................................................... 46
10 Combinators.........................................................................................................51
11 Gallery......................................................................................................................58
12 CSS3.......................................................................................................................... 64
13 Transitions..............................................................................................................64
14 Animations............................................................................................................ 66
15 Multiple Columns...............................................................................................69
16 Re-sizing................................................................................................................. 71
17 Shadows..................................................................................................................72
18 Border Radius.......................................................................................................74
19 Gradients................................................................................................................76
20 Displaying Texts..................................................................................................78
21 ......................................................................................................................82
22 .............................................................................................................83
23 ......................................................................................84
24 .............................................................................................................86
25 .................................................................................................................. 89
www.kaniyam.com
1 Cascading Style Sheets

Cascading Style Sheets CSS . HTML

. HTML- font color, size,
bgcolor attributes-
,
.
.
HTML .
CSS .
CSS file-,
HTML file-
. HTML file- css file-
.
html file- css file 4 .
,
1. External style sheet
2. Internal style sheet
3. Inline style sheet
4. Multiple style sheet
www.kaniyam.com
10
style sheets html

.
css-
.
1.1 HTML without CSS

css . html
.
<html>
<head></head>
<body bgcolor='skyblue'>
<h1 align='center'><font color="blue" size=18
face="Arial">
<u>Most children love being told Nursery
Rhymes</u></font></h1>
<p><i><font color="green" size=18 face="Times New Roman">
The most popular rhymes are listed here. Even elders love
to hear these rhymes.
The list is clearly not exhaustive but it is believed that
a good cross section
of famous poems for children have been
included.</font></i></p>
</body>
</html>
www.kaniyam.com
11
<h1> , <p> -
tag-
. <u>,
<i>, <font>
<h1> , <p> tag- .
html
.
output .
www.kaniyam.com
12
1.2 Internal style sheet

Internal style sheet-
.
<html>
<head>
<style>
body {background-color:skyblue;}
h1 {text-align:center;textdecoration:underline;color:blue;font-family:Arial;fontsize=36pt;}
p{font-style:italic;color:green;font-size=36pt;}
www.kaniyam.com
13
</style>
</head>
<body>
<h1>Most children love being told Nursery Rhymes</h1>
<p>The most popular rhymes are listed here. Even elders
love to hear these rhymes.
of famous poems for children have been included.</p>
</body>
</html>
www.kaniyam.com
14
<h1> , <p> -
<style> tag -
. <head> tag -
.
h1, p - { } - .
{ -: ; -: ;
-: ; } .
<u>- text-decoration:underline
, <i>- font-style:italic
. css-
.
1.3 External style sheet

External style sheet-
.
<html>
<head><link rel="stylesheet" type="text/css"
href="nithya.css"></head>
<body>
<p>The most popular rhymes are listed here. Even elders
love to hear these rhymes.
www.kaniyam.com
15

</body>
</html>
<style> <head> tag - .

<link> .
rel, type, href- stylesheet
.
Internal style sheet- <style>-
file- .css
. <h1> , <p> -
www.kaniyam.com
16

nithya.css file- <link>- .
external style sheet .
nithya.css- .
1.4 Inline style sheet

Inline style sheet-
.
<html>
<head></head>
<body style="background-color:skyblue;">
<h1 style="text-align:center;textdecoration:underline;color:blue;font-family:Arial;fontsize=36pt;">
Most children love being told Nursery Rhymes</h1>
<p style="font-style:italic;color:green;font-size=36pt;">
</body>
</html>
www.kaniyam.com
17
<h1> , <p> -
tag-
. html -
<u> , <i> html
{text-decoration:underline ; font-style:italic} css
.
1.5 Multiple style sheet

Multiple style sheet inline, internal, external
. inline, internal , external 3
css .
www.kaniyam.com
18
<html>
<head>
<link rel="stylesheet" type="text/css" href="nithya.css">
<style>
body {background-color:skyblue;}
h1 {font-family:Times New Roman;}
p{font-style:italic;color:green;font-size=36pt;}
</style>
</head>
<body style="background-color:skyblue;">
<p style="color:red;font-size=36pt;">
</body>
</html>
www.kaniyam.com
19
<h1> - Times New Roman-

internal css-
external css- . <p> -
inline css- internal css-
.
inline css- internal,
external- .
inline, internal, external .
multiple style sheet .
www.kaniyam.com
20
( HTML http://www.kaniyam.com/learn-html-in-tamil/ ) Text, font, links, list,

tables HTML
.
CSS .
www.kaniyam.com
21
2 Text
color . 3
: HEX
(e.g: "#ff0000") , RGB (e.g: "rgb(255,0,0)")
. (e.g: "red").
text-align
. Left , Right
, center
. Justify
, margin-
.
text-decoration
link-
.
text-transform
. uppercase
, lowercase
, Capitalize

.
www.kaniyam.com
22
text-indent (eg. 50px)

.

HTML program- .
<html>
<head>
<style>
p.first {color:green; text-decoration:overline; texttransform:uppercase; text-indent:50px;}
p.second {color:#0000ff; text-align:right; textdecoration:line-through; text-transform:lowercase;}
p.third {color:rgb(255,0,0); text-align:center; textdecoration:underline; text-decoration:capitalize;}
</style>
</head>
<body>
<p class=first> Dont Giveup! Keep on Trying! </p>
<p class=second>Even through it seems to be impossible,
It will happen in your life one day. </p>
<p class=third> All the very best Friends! Wait to
receive the surprises in your life!!!!!!</p>
</body>
</html>
www.kaniyam.com
23
www.kaniyam.com
24
3 Font
font-family .
("Times New
Roman", Times, serif),
, 3-
.
font-style
. Normal, Italic, Bold, Oblique
.
font-size . px-
em- .

HTML program- .
<html>
<head>
<style>
p.first {font-family:Tiems New Roman, Times, serif;
font-style:normal; font-size:10;}
p.second {font-style:italic; font-size:20;}
www.kaniyam.com
25
p.third {font-style:bold; font-size:30;}

</style>
</head>
<body>
<p class=first> Dont Giveup! Keep on Trying! </p>
<p class=second>Even through it seems to be impossible,
It will happen in your life one day. </p>
<p class=third> All the very best Friends! Wait to
receive the surprises in your life!!!!!!</p>
</body>
</html>
www.kaniyam.com
26
4 Links
link- color, font-family, font size
.
.
a:link = link .
a:hover = Mouse cursor- link-
link
.
a:active = link-
.
a:visited = link-
.
<html>
<head>
<style>
a:hover {color:red;background-color:yellow;}
a:active {color:white;background-color:black;}
</style>
</head>
www.kaniyam.com
27
<body>
<a href=http://www.kaniyam.com/mysql-book-in-tamil/
target=_blank> Click here for MYSQL book </a>
</body>
</html>
www.kaniyam.com
28
5 Lists
HTML- Ordered list 1,2,3...
, Unordered list
. CSS-
.
, (a,b,c...), (I, II, III) , (A,B,C..)
. .
<html>
<head>
<style>
ol li {list-style-type:upper-roman;}
ol li {list-style-type:circle;}
</style>
</head>
<body>
Types of Testing
<ol>
<li>Functional Testing</li>
<li>Non-functional Testing</li>
</ol>
Types of non-functional testing
<ul>
<li>Performance Testing</li>
www.kaniyam.com
29
<li>Automation Testing</li>
</ul>
</body>
</html>
list-type-style list-
.
Visibility
. hidden
.
www.kaniyam.com
30
Display Inline list-

.
<html>
<head>
<style>
ol li {visibility: hidden;}
ol li {display: inline;}
</style>
</head>
<body>
Types of Testing
<ol>
<li>Functional Testing</li>
<li>Non-functional Testing</li>
</ol>
Types of non-functional testing
<ul>
<li>Performance Testing</li>
<li>Automation Testing</li>
</ul>
</body>
www.kaniyam.com
31
</html>
www.kaniyam.com
32
6 Tables
CSS- tables-
. table
, table heading ,
table data
.
<html>
<head>
<style>
table {width:60%; height: 40%; border: 3px solid red;}
th {border: 2px solid green;}
td {border: 1px solid orange;}
</style>
</head>
<body> <table>
<tr>
<th>Name</th>
<th>Marks</th>
<th>Rank</th>
</tr>
<tr>
<th>Viyan</th>
<th>1200/1200</th>
www.kaniyam.com
33
<th>First</th>
</tr>
<tr>
<th>Harini</th>
<th>1180/1200</th>
<th>Second</th>
</tr>
</table></body>
</html>
table, th & td 3-
border . 3- table-
.
border-collapse
collapse . .
www.kaniyam.com
34
table {width:60%; height:40%; border: 3px solid red;

border-collapse: collapse;}
www.kaniyam.com
35
7 Divisions
Division content-
.
.
<html>
<head>
<style>
div {width:60%; height: 40%; border: 3px solid red; }
</style>
</head>
<body> <div>Dont Giveup! Keep on Trying! Even though it
seems to be impossible, It will happen in your life one
day. All the very best friends! Wait to see the miracle in
your life!!!!!! </div></body>
</html>
www.kaniyam.com
36
division- , , border
.
margin:25px division
25px .
div {width:60%; height: 40%; border: 3px solid red;
margin:25px; }
www.kaniyam.com
37
division- content-
margin padding:25px .
.
div {width:60%; height: 40%; border: 3px solid red;
margin:25px;padding: 25px; }
www.kaniyam.com
38
www.kaniyam.com
39
8 Body background

style .
<html>
<head>
<style>
body {background-color: skyblue;}
</style>
</head>
<body> Dont Giveup! Keep on Trying! Even though it seems
to be impossible, It will happen in your life one day. All
the very best friends! Wait to see the miracle in your
life!!!!!! </body>
</html>
www.kaniyam.com
40
.
.
body {background: url("image.gif");}
www.kaniyam.com
41

.
no repeat .
.
body {background: url("image.gif")no-repeat;}
www.kaniyam.com
42
no-repeat .
no-repeat right top .
.
body {background: url("image.gif")no-repeat right top;}
www.kaniyam.com
43
repeat-x
, repeat-y
, . .
body {background: url("image.gif")repeat-x;}
www.kaniyam.com
44
body {background: url("image.gif")repeat-y;}
www.kaniyam.com
45
9 Positioning
Positioning-
.
Left, Right, Top, Bottom
. Fixed, Static, Relative 3
positioning- .

static positioning . 4 .
.
<html>
<head>
<style>
p.a {position:static; top:5px; right:30px}
</style>
</head>
<body>
<p class=a> Dont Giveup! Keep on Trying! </p>
<p class=b>Even though it seems to be impossible, It will
happen in your life one day. </p>
<p class=c>All the very best friends! Wait to see the
miracle in your life!!!!!! </p>
</body>
</html>
www.kaniyam.com
46
top:5px; right:30px;
.
Position : fixed top:5px;
right:30px; ,
. .
browser-
,
overwrite .
www.kaniyam.com
47
<html>
<head>
<style>
p.a {position:fixed; top:5px; right:30px}
</style>
</head>
<body>
</body>
</html>
www.kaniyam.com
48
Position : relative
.
, 30px
.
<html>
<head>
<style>
p.a {position:relative; top:5px; right:30px}
</style>
</head>
<body>
</body>
</html>
www.kaniyam.com
49
www.kaniyam.com
50
10
Combinators
Combinator selector-
. <div> , <p>
selectors.
combinator .
div p { ----- } : div, p selector-
style- , style-
div p- .
<html>
<head>
<style>
div p {background-color:skyblue;}
</style>
</head>
<body>
<div>
<p> Dont Giveup! Keep on Trying! </p>
<b><p>Even though it seems to be impossible, It will
happen in your life one day. </p></b>
www.kaniyam.com
51
</div>
<p>All the very best friends!</p>
<p> Wait to see the miracle in your life!!!!!! </p>
</body>
</html>
div ~ p { ----- } : div, p selector- ~

div- p-
style .
www.kaniyam.com
52
<html>
<head>
<style>
div ~ p {background-color:skyblue;}
</style>
</head>
<body>
<div>
happen in your life one day. </p><b>
</div>
</body>
</html>
www.kaniyam.com
53
div + p { ----- } : div, p selector- +

div- p-
style .
<html>
<head>
<style>
div + p {background-color:skyblue;}
</style>
</head>
<body>
<div>
www.kaniyam.com
54
</div>
</body>
</html>
div > p { ----- } : div, p selector- >

div p- style . p tag- style
.
www.kaniyam.com
55
<html>
<head>
<style>
div > p {background-color:skyblue;}
</style>
</head>
<body>
<div>
</div>
</body>
</html>
www.kaniyam.com
56
www.kaniyam.com
57
11
Gallery
Gallery .
Gallery-
, .
gallery- .
<html>
<head>
<style>
div.one {margin:5px; padding:5px; border:1px; solid red;
float:left; text-align:center;}
div.one img { display:inline; margin: 5px; border:1px
solid yellow; width:170px; height:150px;}
div.one a:hover img{border:1px solid blue;}
div.two {text-align:center; font-weight:normal;
width:120px; margin:5px;}
</style>
</head>
www.kaniyam.com
58
<body>
<div class="one"> <a target="_blank" href="a1.jpg"><img
src="a1.jpg"></a> <div class="two">1</div></div>
</body>
</html>
www.kaniyam.com
59
<style>- div.one
one division
. <img>-
.
cursor image- image
border a:hover
. one
division- two division-
www.kaniyam.com
60
image- .
Gallery- image- cursor
image ,
Opacity
. 100- image-
. .
<html>
<head>
<style>
div.one {margin:5px; padding:5px; border:1px; solid red;
float:left; text-align:center;}
div.one img { display:inline; margin: 5px; border:1px
solid yellow; width:170px; height:150px; opacity: 0.4;
filter:alpha(opacity=40);}
div.one a:hover img{border:1px solid blue;opacity: 1;
filter:alpha(opacity=100);}
div.two {text-align:center; font-weight:normal;
width:120px; margin:5px;}
</style>
www.kaniyam.com
61
</head>
<body>
</body>
</html>
www.kaniyam.com
62
IE8 version- filter:alpha(opacity=40);

. opacity:0.4;
.
www.kaniyam.com
63
12
CSS3
CSS3
. screenshot
.
. .
13
Transitions

. cursor- ,

.
cursor-
.
division-
transition . <div>
</div> program- style section-
.
div {width: 100px; height: 100px; background: red;
transition: width 1s, height 1s;}
div:hover {width: 300px; height: 300px;}
100px divition- 300px
. 100px
www.kaniyam.com
64
division- cursor- , 300px

div:hover .
1 second-
transition- <div> property- .
division- cursor 1 second-

division- . cursor
1 second- division .
Transition-Delay:
Transition-delay
.
div {transition-delay: 1s; transition: width 1s, height
1s; }
, 1 1
division- .
Transform:
Transform
.
div:hover {width: 300px; height: 300px; transform:
rotate(180deg)}
www.kaniyam.com
65
180 degree- 300px

. degree- 90, 180, 360, 1200
.
14
Animations
Animation
.

Animation .
division-
. <div> </div> program-
style section-
.
div {width: 100px; height: 100px; background: red; }
100px
. Animation- ,

animation .
div {width: 100px; height: 100px; background: red;
position: relative; animation: nithya 5s; }
www.kaniyam.com
66
animation: nithya 5s; 'nithya' 5 second animation- . 2s

, animation- 2
(animation: nithya 5s 2s;). animation-
.
infinite
(animation: nithya 5s 2s infinite;). .
@keyframes:
animation @keyframes nithya-
. style section- .
@keyframes nithya {0%{left:0px; top:0px;}25%{left:200px;
top:0px;}50%{left:200px; top:200px;}75%{left:0px;
top:200px;}100%{left:0px; top:0px;}}
- division- .
, animation- 5 second 25%
division , 50%
division , 75%, 100% -
. 5 second- division
. 0px, 200px

. @keyframes division
.
www.kaniyam.com
67

background-color
keyframes - . 25%{background-color: yellow;
left:200px; top:0px;}
www.kaniyam.com
68
15
Multiple Columns
columns-
.
column-count
. paragraph-
program- style section-
.
<p><b>This blog will tells you about how to make
estimation for an ETL project with SMC Model.</b></p>
<div> Based on the requirement we need to calculate the
overall tables count and we need to categorize them as
simple tables, medium tables and complex tables. Rough
values are given below. Here I have considered all the 30
staging tables as simple. So I have categorized only the
warehouse tables. All the values mentioned in the above
Test Case Unit Efforts are fact values. We cant change
it. So no need to worry about this. We can keep this as it
is and lets go for the staging table & warehouse tables
validation part.</div>
div{-webkit-column-count: 3;}
www.kaniyam.com
69
paragraph-
3 column- . column-
column-gap: 40px;
. columnrule . column-rule: 1px solid lightblue; 1px
, solid ,
lightblue .
paragraph- h1- column column-
, column-span . style
section- .
h1 {column-span: all;}
www.kaniyam.com
70
16
Re-sizing
,
border- Re-sizing .
heading, division, paragraph
. heading-
program- style section-
.
<h1>This blog will tells you about how to make estimation
for an ETL project with SMC Model.</h1>
h1 {border: 2px solid; padding: 20px; width: 300px;
resize: both; overflow: auto;}
resize: both heading-
resize . resize
horizontal , vertical .
overflow: auto resize-
.
www.kaniyam.com
71
17
Shadows
Shadows .
text-shadow , boxshadow
.
,

.
text division- program-
style section-
.
<h1>This blog will tells you about how to make estimation
for an ETL project with SMC Model.</h1>
<div>SMC Model is nothing but simple, medium and complex
estimation</div>
h1 {text-shadow: 2px 2px 5px red;}
div {width: 300px; height: 50px; border: 2px solid; boxshadow: 10px 10px 5px blue;}
www.kaniyam.com
72
text-shadow- 2px 2px

.
5px red ,
pixel-
.
www.kaniyam.com
73
18
Border Radius
CSS- border content- border-

. CSS3- border-radius
border- ,
. 25px, 50px,
100px
.
heading- program-
style section- .
<h1>This is my Country</h1>
h1 {border-radius: 25px; border: 2px solid black;
padding:20px; width: 200px; height: 100px;}
www.kaniyam.com
74
border-radius 25px , border-

25px- .

border-radius: 15px 25px 50px 100px;
.
www.kaniyam.com
75
19
Gradients
division-
gradient . linear-gradient, radicalgradient .
linear-gradient
. radicalgradient .
division- program-
style section- .
div {height: 200px; background: linear-gradient(red,
blue); }
www.kaniyam.com
76
linear-gradient . .
, linear-gradient(to
right, red, blue) .
radicalgradient .
div {height: 200px; background: radical-gradient(red,
blue, green); }
www.kaniyam.com
77
20
Displaying Texts
border
CSS3- .
text-overflow, word-wrap, word-break 3
.
text-overflow border- .
clip border-
. ellipsis
border-
... .
text-overflow overflow-

. overflow- hidden
, visible
.

<body>
<p class="a">India is my country. All Indians are my
brothers and sisters. I love my country.</p>
<p class="b">India is my country. All Indians are my
brothers and sisters. I love my country.</p>
<div class="test" style="text-overflow:ellipsis;">This is
www.kaniyam.com
78
some long text that will not fit in the box</div><br>

<div class="test" style="text-overflow:clip;">This is some
long text that will not fit in the box</div>
</body>
<style>
p.a{white-space: nowrap; width: 200px; border: 1px solid
black; overflow: hidden; text-overflow: clip;}
p.b{white-space: nowrap; width: 200px; border: 1px solid
black; overflow: hidden; text-overflow: ellipsis;}
div.test {white-space: nowrap; width: 200px; overflow:
hidden; border: 1px solid black;}
div.test:hover {text-overflow: inherit; overflow:
visible;}
</style>
www.kaniyam.com
79
word-wrap border
.
.
<p> CognizantTechnologySolutions. The bestplacetowork.</p>
p{width: 150px; border: 1px solid green; word-wrap: breakword;}
word-wrap

.
word-wrap break-all
, keep-all

.
www.kaniyam.com
80
.
<p class="a">CognizantTechnologySolutions. The
bestplacetowork.</p>
<p class="b">CognizantTechnologySolutions. The
bestplacetowork.</p>
p.a{width: 140px; border: 1px solid black; word-break:
keep-all;}
p.b{width: 140px; border: 1px solid black; word-break:
break-all;}
www.kaniyam.com
81
21
Cascading Style Sheets -

.
.
,
.
.
http:// www. w3 schools. com/ css/

http://learnlayout.com/
http://www.csstutorial.net/
http://alistapart.com/
http:// www. csszengarden. com/
www.kaniyam.com
82
22
.
. Cognizant Technologies
Solutions , Datawarehouse Testing .

,
, .
.
- nithyadurai87@gmai.com
- http://nithyashrinivasan.wordpress.com
www.kaniyam.com
83
23
'
www.kaniyam.com
84
http://freetamilebooks.com/ebooks/learn-mysql-in-tamil/
http://freetamilebooks.com/ebooks/learn-gnulinux-in-tamil-part1/
http://freetamilebooks.com/ebooks/learn-gnulinux-in-tamil-part2/
http://freetamilebooks.com/ebooks/html-in-tamil/
http://freetamilebooks.com/ebooks/learn-mysql-in-tamil-part-2/
www.kaniyam.com
85
24

.
, , .
.

.
, ,
.
.
.

.
editor@kaniyam.com

.
:

.

.
, .
www.kaniyam.com
86

.
,
.
.
, , , ,
,
.
.

editor@kaniyam.com .
,
.
editor@kaniyam.com .

.

.

.
.

.

2013 .

http://creativecommons.org/licenses/by-sa/3.0/
.
www.kaniyam.com
87
,

, , ,
, ,
.
: . editor@kaniyam.com
+91 98417 95468
www.kaniyam.com
88
25
Creative Commons ,

.
.
Name - Nithya Duraisamy
ICICI - 006101540799
Branch - Mcity branch, chengalpattu.
IFSC code - ICIC0000061
www.kaniyam.com

Eliya Tamil Css

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Eliya Tamil Css

Uploaded by

Copyright:

Available Formats

2

Cascading Style Sheets

This work is licensed under a Creative Commons Attribution-ShareAlike

1 Cascading Style Sheets....................................................................................10

1 Cascading Style Sheets

style sheets html

1.1 HTML without CSS

1.2 Internal style sheet

1.3 External style sheet

The list is clearly not exhaustive but it is believed that

<style> <head> tag - .

1.4 Inline style sheet

1.5 Multiple style sheet

<h1> - Times New Roman-

( HTML http://www.kaniyam.com/learn-html-in-tamil/ ) Text, font, links, list,

text-indent (eg. 50px)

p.third {font-style:bold; font-size:30;}

Display Inline list-

table {width:60%; height:40%; border: 3px solid red;

body {background: url("image.gif");}

body {background: url("image.gif")repeat-y;}

div ~ p { ----- } : div, p selector- ~

div + p { ----- } : div, p selector- +

div > p { ----- } : div, p selector- >

IE8 version- filter:alpha(opacity=40);

division- cursor- , 300px

division- cursor 1 second-

180 degree- 300px

animation: nithya 5s; 'nithya' 5 second animation- . 2s

text-shadow- 2px 2px

CSS- border content- border-

border-radius 25px , border-

some long text that will not fit in the box</div><br>

Cascading Style Sheets -

http:// www. w3 schools. com/ css/

http:// www. csszengarden. com/

+91 98417 95468

You might also like