The Art & Science of JavaScript (section Ⅰ)
19:47:31
The Art & Science of JavaScript
http://www.sitepoint.com/books/jsdesign1/
Chapter 1: Fun with Tables
first. we should known what is table,and tables should have which features?
tables : the basic feature of tables is that its have rows and columns , and its can make as matrix.With tables we may sort nubmers, set rows and colums ,show diffrent elements,now with the user friendly we should add some function such as drag the columns for switch and use keybord to oprerate the tables.with the target of upside descripted. the next thing is how to comply these features with JavaScript.
the first thing we should do is make a table.As begin we should learn how to use CSS to generate a beautiful table which is friendly to user.
simply css(CSS (Cascading Style Sheets) is used to style HTML elements) study:
1.the simply use of css:
1 <!DOCTYPE html> 2 <html> 3 <body style="background-color:PowderBlue;"> 4 <h1>Look! Styles and colors</h1> 5 <p style="font-family:verdana;color:red;"> 6 This text is in Verdana and red</p> 7 <p style="font-family:times;color:green;">中国</p> 8 <p style="font-size:30px;">This text is 30 pixels high</p> 9 </body> 10 </html>
you can copy the file to a text file and then save as html file and then you can see the result.as the instance show ,we see some different features of the text and the canvas.but it not the best way as this written.
2.you may see the next way.
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <style type="text/css"> 5 h1 {color:red;} 6 h2 {color:blue;} 7 p {color:green;} 8 </style> 9 </head> 10 <body> 11 <h1>All header 1 elements will be red</h1> 12 <h2>All header 2 elements will be blue</h2> 13 <p>All text in paragraphs will be green.</p> 14 <p>how are you 中国?</p> 15 <a href="http://www.w3schools.com" style="text-decoration:none;">Visit W3Schools.com!</a> 16 </body> 17 </html>
3.It is so beautiful,and the next example is use very useful.
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <link rel="stylesheet" type="text/css" href="styles.css"> 5 <!-- use the <link> tag to link to an external style sheet.--> 6 </head> 7 <body> 8 <h1>I am formatted with an external style sheet</h1> 9 <p>Me too!</p> 10 </body> 11 </html>
CSS can be added to HTML in the following ways(known that is very important !):
1.Inline - using the style attribute in HTML elements as example one
2.Internal - using the <style> element in the <head> section as example two
3.External - using an external CSS file as example three.
The preferred way to add CSS to HTML, is to put CSS syntax in separate CSS files.