|
Obsolete tags Use CSS Lint to check your style sheet! These HTML tags and attributes that have been superseded by other more functional or flexible alternatives (as a TAG or as acronym `CSS ) are declared as deprecated in HTML4.
td rowspan=2 if necessary to allow broken lines.
The CSS alternative involves relative or absolute positioning or margin control.
- the navigation links are separated from the content using the CSS class "header".
Places the second column start at a fixed position from the left margin, similar to newspaper columns. There are attributes which are deprecated.
|
<b> means Bring Attention To element (not bold!)See http://www.htmlhelp.com/reference/html40/structure.html for the real deal.
<-- begins a comment, but -- cannot occur within a comment -->
Elements www.w3.org ,
Attributes (height, onmousexxx, title,align...)
javaScript: within a function
daCount=document.getElementById(countBox);daCount.value='1';
daCount=document.getElementsByName(countBox);daCount[0].value='1';
Tables CSS , w3 ;
HTML W3 tables
w3
scripts
user interface Cursor ,
AccessKeys ,
special characters ,
fonts,
text
w3
CSS W3,CSS3 Values&Units , default style sheet for HTML 4.0
CSS FontSelection, css-index, properties ex: border-style, font-variant, select,
ColorNames,
forms
AccessKeys,
Netscape's definition for Embed http://www.webreference.com/js/column20/embed.html
Document Object Model xref (DOM)
<STYLE>
A.menu:link,A.menu:visited,A.menu:hover,A.menu:active
{ TEXT-DECORATION: none}
A.active:visited { TEXT-DECORATION: none; color:crimson; cursor:crosshair}
TD.active { FONT-SIZE:60%; border-color:blue; TEXT-ALIGN:center; cursor:crosshair; border-width:20 }
TD.menu { FONT-SIZE:120%; border-color:brown; TEXT-ALIGN:center; cursor:help }
TD.sep { background-color:lightCyan }
</STYLE>
| border-style:solid class=active not default | double class=active colspan=9 | |||||||||
| <tr bgcolor=aliceblue style=boder-width:1;border-style:dotted | 2 dotted | 3 dotted | 4 dotted | 5 dotted | ||||||
| 6 dotted | 7 dotted | 8 dotted | 9 dotted | 10 dotted | ||||||
| style=border-style: 4 dashed | 2 dashed | 5 dashed colspan=9 | ||||||||
|
style=border-style:
ridge;border-width:10; coming out default !
groove | carved into
inset | look as though it were embedded
outset | look as though it were coming out <td style=border-width:10;border-style:outset; border-top-color:red;border-right-color:paleGreen;border-bottom-color:pink;border-left-color:green; > | |||||||||
<p onclick="sitemap();" style=color:brown;background-color:snow; >
Click anywhere
in this paragraph (!) to see
helpWindow =
window.open('null-location','nameishelp',
'width=1024,height=768,scrollbars=1,screenX=40,screenY=100,left=400,top=600');
Be patient. some it takes a second or 2
Interestingly, even if you click more than once you only get one window
You must click where there is text !! i.e. not on the right edge
</p>
Table clicking :
Putting text or images in a table the full width of the page makes the entire table clickable, onMouseover able...
Neat !
format WITHOUT java script onMouse*** :
<table... <a href=...<input onpaste="return=false" prevents pasting<tr style=cursor:hand... <td... <td... </a> ... </table>
Cannot paste here: ; OK to paste here: ; type=password:
<table border=10 width=100% cellspacing=20 onclick="alert('You clicked in the TABLE ')" >
<tr onclick="alert('You clicked in the TR ')" width=70% >
| width=20% |
<td onclick="alert('You clicked in the second TD ')" width=50% > Next Data cell (20%) has only a space beteen the td and /td tags (it doesn't even show a border!) In fact you CAN click in it if you imagine where it is!!! |
HTML tags surrounded by < and > are usually found in pairs.
Paragraphs are terminated by <p> and the browser will add a blank line
line brakes can be forced by adding <br>. This tag is not paired
If you have a block of text that is PREformated you can use <pre> to start. After the preformated text use </pre> to end, but be careful since this causes the alternate font to be used and if the user has a narrower window then you expect the right side of you prefromated text will be cut off!
<pre style=font-size:12pt>
10 20 30 40 50 60 70 80 90 100 110 120 130 140 150 160
123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890
1234567890
this font is not changed this font is decreased 1 size by using <font size=-1> OR NOT!
this font is not changed
this font is increased 1 size by using <font size=+1>
this font is increased 2 sizes by using <font size=+2>
<font> has been deprecated in favor of <style=font-….
this font is increased 2 sizes by using <span style=font-size:+2> OR NOT!
this font is decreased by using <span style=font-size:90%> OR NOT!
this font is Not changed
this font is increased by using <span style=font-size:110%>
this font is increased by using <span style=font-size:125%>
this font is increased by using <span style=font-size:150%>
this font is increased by using <span style=font-size:175%>
ABsolute i.i NOT relativebr>
this font is smallest by using <span style=font-size:xx-small>
this font is smaller by using <span style=font-size:x-small>
this font is small by using <span style=font-size:small>
this font is ? by using <span style=font-size:>
this font is large by using <span style=font-size:large>
this font is larget by using <span style=font-size:x-large>
this font is largest by using <span style=font-size:xx-large>
<span style=color:red>RED</span>
<h2>this is a Heading level 2 </h2>
Headings add
margin above and below so you might want to use font sizes instead.Heading Ruler like below is entered using <hr>
++++++++++++++Colors should be used sparingly for emphisis and avoid eye straining combinations.
+++++++++++
use <font color=??? > before the colored text and </font > after.
red
aqua
black
blue
fuschia
gray
green
lime
maroon
olive
purple
red
silver
teal
white
yellow
black
|
red
aqua
black
blue
fuschia
gray
green
lime
maroon
olive
purple
red
silver
teal
white
yellow
black
| |
This image is pulled in by having a GIF and using