CSS Margin and Padding [Designikx Tutorial]

Designikx Tutorial - https://designikx.wordpress.com
Today’s topic is CSS Box Model – Border, Margin and Padding

What is box model?

Margin, border, padding and contents of the element are together known as the The Box Model.
We don’t have to use all of these. But its good to keep box model in mind.
The graphical representation of The Box Model is as… Read more of this post

CSS Gradient : How to Use

CSS Gradient :  How to use

Safari, Chrome, Firefox, Opera, Internet Explorer – all major browser supports CSS Gradients. Internet Explorer doesn’t support all CSS Gradient properties. The features like gradient repeat, gradient angle, and radial gradient are not supported by Internet Explorer. It supports only horizontal and vertical linear gradient with two colors.

Read more of this post

Chapter 2 – CSS Background Properties

Background Properties
sets color, image, repeat, attachment, and position

Read more of this post

Learn CSS Easily (CSS Tutorial)

What is CSS?

CSS stands for Cascading Style Sheets

————————————

Why we need CSS?

CSS provides reusability,
Giving style capabilities in HTML are quite limited.
Also, with the use of an external style sheet, you are able to change you entire site style,
by only editing one single file!

————————————

Read more of this post

Background image slideshow javascript source code

Here is the code for background image slideshow using javascript and css.

check out the code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="en-us">
<style>
body{
background-repeat: no-repeat;
background-position: 50 50;
}
</style>
<script >
//Specify background images to slide
var imgs=new Array()
imgs[0]="img1.jpg";
imgs[1]="img2.jpg";
imgs[2]="img3.jpg";
//Specify interval between slide (in miliseconds)
var speed=2000
//preload images
var processed=new Array()
for (i=0;i<imgs.length;i++){
processed[i]=new Image();
processed[i].src=imgs[i];
}
var inc=-1;
function slideimg(){
if (inc<imgs.length-1)
inc++;
else
inc=0;
document.body.background=processed[inc].src;
}
if (document.all||document.getElementById)
window.onload=new Function('setInterval("slideimg()",speed)');
</script>
</head>
<body>
<table border="0" cellpadding="0" cellspacing="0" width="100%" id="table1" height="381">
	<tr>
		<td>
			<p>This is just dummy text</p>
			<p>This is just dummy text</p>
			<p>This is just dummy text</p>
			<p>This is just dummy text</p>
		</td>
	</tr>
</table>
</body>
</html>

You can use it for any elements background.

hope it will be useful.
thanx n regards,
Nikhil Ughade
Web Designer
[Pune]

Pure CSS tooltip, validation hints

CSS TOOLTIP

CSS TOOLTIP

This is a simple css tool tip works on links hover property.
It works on Image / text link.

Read more of this post

%d bloggers like this: