Samsung Galaxy Note, 4G LTE Plans, Transfer Photos Videos from iPhone to Samsung, Network Performance, Mobile Accounts, Furious Gold SPD TooL, Latest Version Full Setup

Info Have Fun Learning CSS

Info Have Fun Learning CSS - this blog we have built from a few years ago and already very much information about gadgets that we convey and a lot of blog visitors New Blog Techno News who are satisfied with the information, we will always try to update the latest information for you, first about Info Have Fun Learning CSS many already we collect data to make this article so you do not miss the news, please see:

Articles : Info Have Fun Learning CSS
full Link : Info Have Fun Learning CSS

You can also see our article on:


Info Have Fun Learning CSS

Cascading Style Sheets (CSS) is a style sheet language designed for the look and formatting of web pages written in HTML.

Sample design





Cool right?

I’ve been busy learning several introductory topics and technologies from Asp.net, CSS, Ajax, Microsoft AJAX and Javascript for three weeks now. I already had some background for the languages designed for engineering purposes but for website design – none.

I’m going to share some of my experiences along the way.

Open your Notepad or you can use the free Visual Web Developer Express Edition and try learning CSS…


Default HTML Code

<html>
<head>

</head>
<body>

</body>
</html>

You can insert the CSS code between the <head> … </head> and <body> … </body> section

<html>
<head>

<style type="text/css">
div.im
{
margin: 3px;
border: 1px solid #000fff;
float: left;
}
div.im a:hover im {border: 3px solid #96cf23;}
</style>

</head>
<body>

</body>
</html>

The CSS code for adding border, margin and floating the images left

div.im
{
margin: 3px;
border: 1px solid #000fff;
float: left;
}

Adding a hover effect once the mouse is located on top of the image

div.im a:hover im {border: 3px solid #96cf23;}

In the <body> … </body> section, lets try using the CSS code using an image.

Default syntax for Image with specified ID, Height and Width

<img src="star.jpg" id="1" height = "90" width = "100"/>

Finalized code

<html>
<head>

<style type="text/css">
div.im
{
margin: 3px;
border: 1px solid #000fff;
float: left;
}
div.im a:hover img {border: 3px solid #96cf23;}
</style>

</head>
<body>

<div class="im"><a href="#"><img id="1" src="http://windowsforus.com/y3/star.jpg" width="110" height="90" /></a> </div>

<div class="im"><a href="#"><img id="2" src="http://windowsforus.com/y3/star.jpg" width="110" height="90" /></a> </div>

<div class="im"><a href="#"><img id="3" src="http://windowsforus.com/y3/star.jpg" width="110" height="90" /></a> </div>

<br clear="all" />

</body>
</html>

Thanks for reading the article!



articles Info Have Fun Learning CSS finished in discussion

hopefully the information we convey about Info Have Fun Learning CSS can benefit you in getting new knowledge about technology,

you just finished reading the information Info Have Fun Learning CSS we hope this informmation can answer the question you submit to googlle, if you want to bookmark or share please use link https://moymoycikukecik.blogspot.com/2011/03/info-have-fun-learning-css.html and do not forget to always visit this blog to get the latest information every day.

Tag :
Share on Facebook
Share on Twitter
Share on Google+
Tags :

Related : Info Have Fun Learning CSS

0 komentar:

Posting Komentar