Your Open Source
Free YourOpenSource Softwares Online Resources and Softwares Downloads with Demo
HTML & CSS
Marquee
The marquee tag allows you to scroll some text of your choice across the screen, and it doesn't need a Javascript to make it work. The only problem with using it is that the marquee tag only works in Internet Explore and Firefox. Netscape will just show the text you wanted to scroll as plain text on the screen. Test
2754
Jun 15 08 04:35:47
Sekar
Curve or Round box in HTML without image
You can create a curve or Round box in HTML code without using curve images. The following code used to create a curve box.
278
Jun 24 08 02:57:26
Sekar
How to use CSS Positioning
simple example for CSS positioning In the following example contains two classes. one is test and another one is Relative : position an element relative to its normal position. Absolute: Position an element using an absolute value Fixed : position an element with relative to the browser window. .test1{ position:relative; } .test2{ posit..
195
Jul 22 08 02:25:35
Psbharathy
HTML Redirection with meta tags
HTML Redirection with meta tags We can redirect the page through HTML tags in the above example the content is used to specify seconds to and the URL is used for target location.
177
Jul 25 08 10:26:35
Psbharathy
Change down arrow style in SELECT tag and Sourcecode downloads
how to change down arrow in SELECT tag :- You can change the dropdown down arrow through CSS & JS. its possible to change the dropdown box as you like. Please click the downloads link to get the source for this.
18472
Aug 27 08 03:29:16
Sekar
CSS IMAGES EFFECTS
hi CSS IMAGE EFFECTS please post the commnets related links http://www.ndesign-studio.com/demo/css-dock-menu/css-dock.html#
194
Aug 01 08 05:42:21
Damu
How to add the your rss feed in Yahoo
Add the your rss feed in Yahoo :- The following to you can add the feed in YAHOO. Add to My Yahoo Output : Add to My Yahoo
162
Aug 07 08 10:34:29
Sekar
Include the style sheet in different ways in html
include the style sheet in different ways --------------------------------------- 1) 2) @import "damu/css/info.css"; @import "damu/css/main.css"; @import "damu/css/daj.css";
173
Aug 18 08 07:57:25
Damu
How to refresh the page in the same page
to refresh the page in the same page Step 1. Click to refresh the page setep2:
167
Aug 20 08 10:08:17
Damu
World Currency Symbol in XML
Currency Symbol in XML Speical Charactor HTML XML £ (Pound ) £ £ € (Euro) € € $ (Dollar) $ $ ¥ (Yen) ¥ ¥ ௹ (Tamil Rupees) ௹ ௹ ₨ ( Rupees) ₨ ..
258
Nov 11 08 04:07:25
Sekar
Background transparency using RGBA in CSS
Normal transparency code as below in css .transbox { width: 400px; height: 180px; margin: 30px 50px; background-color: #ffffff; border: 1px solid black; /* for IE */ filter:alpha(opacity=60); /* CSS3 standard */ opacity:0.6; } Using rgba in CSS to background transparency .transbox{ background-color: rgba(204,204,255,0..
202
Nov 21 08 11:10:31
Sekar
How to do the Flash hidden under DIV ?
Some Javascript menu displayed under flash, if you use wmode="transperent" to resolve the issue, The example code as follows,
140
Mar 12 09 02:39:47
Sekar
Minimum height and width in CSS
you need to expanding height and width if have a content under div element also need to displayed the minimum height and width in the div area. The CSS as follows, .expandDiv{ min-height:200px; } Note :- if use the .expandDiv, the element minimum height is 200 pixels and much more.
125
Mar 20 09 12:23:53
Sekar
Round curve image box like facebook
The HTML and CSS used to create a round box with SPAN tags. The example code as given below, and live demo and downloads also available here, Enjoy!!! In CSS code, .RNDClear{display:block;overflow:hidden;position:relative; width:2px;height:50px;float:left;} .RNDLayout{display:block;background-color:#C4CDE0;overflow:hidden;position:relative..
277
Jun 22 09 07:06:13
Sekar
The basic Structure of CSS
The basic Structure of CSS Now let us have a quick look at a sample CSS rule to refresh our memory on the different parts of CSS and what they are called: _____________Selector | _________ Property | | ____ Value | | | H1 { color: red } |________| Declaration A CSS rule will often de..
125
Jul 15 09 08:29:57
Frm_suresh
HTML group radio button
How to set the GROUP for radio option button in HTML The radio button name is a group of radio buttons the field belongs to. for example:- A1A2A3 B1B2B3 Output is:- A1A2A3 B1B2B3
99
Jul 23 09 08:53:43
Sekar
CSS Font Shortcut
A CSS shortcut that will save you a lot of time coding: Instead of doing this: font-size: 1em; line-height: 1.5em; font-weight: bold; font-style: italic; font-variant: small-caps; font-family: verdana,serif; do this: font: 1em/1.5em bold italic small-caps verdana,serif Note: Specify both the font-size and the font-family. If you were unab..
186
Aug 02 09 07:45:41
Lazywriter
Create 3D Button
Who said that only JavaScript can create 3D effects? Well, that were the old days. Today, we can create 3D buttons using CSS in an easier way using this code: a { display: block; border: 1px solid; border-color: #aaa #000 #000 #aaa; width: 8em; background: #fc0; } a:hover { position: relative; top: 1px; left: 1px; border-color: #000 #aaa #..
76
Aug 02 09 08:04:26
Lazywriter
Cool Photo Gallery Using CSS
Here's a cool css photo effect. It shows an accordion effect; once you hover over an image it expands to full size. CSS: #gallery { padding:0; margin:0; list-style-type:none; overflow:hidden; width:320px; height:425px; border:1px solid #888; background:#fff url(windows/win_back.gif); } #gallery li { float:left; ..
99
Aug 03 09 08:43:15
Lazywriter
Create Pushbuttons With CSS, No Images Required
Make your website more attractive by adding push buttons to your links without using images. Here's the short CSS Code: ul.cpl a { width : 200px; height : auto; display : block; border : 2px outset #669900; text-decoration : none; background-color : #669900; color : #eee; font-weight : bold; padding : 3px 10px; outline :..
75
Aug 03 09 08:02:22
Lazywriter
CSS Cheat Sheet
Here's a CSS Cheat Sheet made by Pete Freit that you may find handy specially when you're running out of time: CSS Cheat Sheet Text Color color: green; Set Background Color background-color: black; Repeat Background Image Horizontally background: white url("/images/bk.gif") repeat-x; Repeat Background Image Vertically background: whit..
59
Aug 03 09 08:11:46
Lazywriter
Add Badge To Your Site Using CSS
Design your website by creating and adding badge or inline buttons. Examples The (X)HTML code: Some Link The CSS code: .inline-button { _width:12em; font: bold 65%/1 Verdana, sans-serif; margin: 0 0.2em; padding: 0.1em 0; _padding:0; border: 1px solid black; white-space:nowrap; text-decoration: none; vertical-align:mid..
63
Aug 03 09 08:26:20
Lazywriter
Simple RSS Feed Button, No Image Required
Make a simple orange XML or RSS buttons without using an image with CSS. Here's the really simple codes: CSS: .feed { border:1px solid;border-color:#FC9 #630 #330 #F96;padding:0 3px;font:bold 10px verdana,sans-serif;color:#FFF;background:#F60;text-decoration:none;margin:4px; } HTML: FEED
111
Aug 04 09 09:34:49
Lazywriter
Create Rounded Corners
Pointed corners are things of the past although some still use it for formality. With CSS in hand, you are free to do whatever you want with your web page. Here's the code that will round your pointed corners: .rtop, .rbottom{display:block} .rtop *, .rbottom *{display: block; height: 1px; overflow: hidden} .r1{margin: 0 5px}..
106
Aug 09 09 10:54:56
Lazywriter
Create Rounded Corners With Images
Here's another rounded corners creator, this time using images: CONTENT .roundcont { width: 250px; background-color: #f90; color: #fff; } .roundcont p { margin: 0 10px; } .roundtop { background: url(tr.gif) no-repeat top right; } .roundbottom { background: url(br.gif) no-repeat top right; } img.corner { width: 15px; height:..
123
Aug 09 09 10:58:48
Lazywriter
Try This CSS Gradient Text Effect
Try this code and watch what will happen to your text: CSS Gradient Text h1 { font: bold 330%/100% "Lucida Grande"; position: relative; color: #464646; } h1 span { background: url(gradient.png) repeat-x; position: absolute; display: block; width: 100%; height: 31px; }
90
Aug 09 09 11:03:43
Lazywriter
Iframe border
IFrame border IE/Firefox/Safari/Opera Here can set the iframe border is none for all browser, the following code will support all browsers. Code:- Output :-
53
Aug 15 09 09:03:17
Sekar
Css curved corners
CSS Curve Corners This code will work in all the latest browsers (FireFox, Opera,Netscape ) the CSS and HTML code as follows,<style type="text/css">.curvebox { margin: 10px; background: #666666; color:#FFFFFF; border: 1px solid #CCCCCC; -moz-border-radius: 10px; }.innerCurve{ background: #FFFFFF; color:#000000; border: 1px solid #0066..
1747
Nov 16 09 11:23:58
Psbharathy




