前段時間學習了HTML和一些簡單的CSS樣式，自己也簡單做了嘗試，下面是我對HTML+CSS+javascript的一些總結(jié)。
<html> <head>...</head> <body>...</body></html>2.在head的標簽里，也可以添加其他的一些標簽，而絕大部分這些標簽是不會作為內(nèi)容顯示在網(wǎng)頁給讀者看的，下面是可以用在head標簽里的一些常用標簽：<head> <title>...</title> <meta> <link> <style>...</style> <script>...</script></head>（1）<title>標簽很顯眼，它會顯示在瀏覽器的標題欄中，以此來告訴瀏覽者這個網(wǎng)頁的主要內(nèi)容。就像我截的圖一樣“我的CSDN”這幾個字就是寫在<title>里的。（2）<style>標簽就是我們要在里面寫的一些css樣式，例如改變網(wǎng)頁的字體啊字體顏色啊插入一些圖片啊等等。3.代碼注釋：
<!--注釋部分-->二.認識標簽
接下來我把一些常用標簽整理出來，列在下面。1.<p>段落</p>2.<hx>文章標題，其中的x分為1~6，寫的時候講x改為1~6，并且從1開始字體逐級變小</hx>3.<em>該部分變?yōu)樾斌w</em>4.<strong>該部分變?yōu)榇煮w</strong>5.<span>只是為了能夠設置css樣式，沒有任何其他意義</span>6.<q>引用別人的話，注意不能加“”因為它自動會幫你添加</q><blockquote>剛剛的標簽適合短文本，這個適合長文本的引</blockquote>7.在網(wǎng)頁添加空格， 一個這個符號就是一個空格。8.<hr/>水平橫線 <br/>轉(zhuǎn)行符9.<address>添加地址</address>10.<code>代碼語言</code><PRe>大段代碼</pre>11.新聞新列表，在<li>中顯示的內(nèi)容前面會出現(xiàn)一個這樣的“·”小點點<ul> <li>...</li> <li>...</li></ul>如果將<ul>改成<ol>，那么前面的小點點就會變成：“1.”，“2.”.......12.有一個經(jīng)常會用到的標簽<div>，這個標簽可以將一個網(wǎng)頁劃成一塊一塊的小塊，下面的內(nèi)容會介紹到盒子模型。13.在網(wǎng)頁上制作一個表格。<table summary="簡介表格內(nèi)容"><!--該部分是不會在網(wǎng)頁中顯示的，table是一定要出現(xiàn)的可以不出現(xiàn)summary--><caption>...</caption><!--這里填的是表格的標題，會顯示--><tbody><!--這個的作用是等表格全部加載出來了一起顯示在網(wǎng)頁上，如果沒有這個，那么加載一點，表格顯示一點--> <tr><!--表格的一行--> <th>...</th><!--表格的表頭內(nèi)容，這里有三個<th>表示有一行有三個表頭--> <th>...</th> <th>...</th> </tr> <tr> <td>...</td><!--這表示表格的列數(shù)--> <td>...</td> <td>...</td> </tr> <tr> <td>...</td> <td>...</td> <td>...</td> </tr></tbody></table>兩點注意點：（1）不設置css樣式時，表格是沒有線的。 （2）表頭在默認情況下顯示的是粗體居中。14.加上鏈接。 例如：<a href="http://www.csdn.net" title="博客頻道” target="_blank">博客</a>博客是在網(wǎng)頁上顯示的內(nèi)容，當點擊博客兩個字是會連接到csdn這個網(wǎng)站上去，當鼠標滑過博客兩個字時會出現(xiàn)"博客頻道“這四個字。我特意截了一下效果圖：下一張是鼠標滑過時的效果圖：
15.插入圖片。
<img src="圖片的地址” alt="圖片下載失敗后顯示的內(nèi)容" title="鼠標滑過該圖片是顯示的提示文本">三.認識表單
在實際生活中，我們常常會看到一個頁面讓用戶填寫并提交，同樣，我把一些常用的表單標簽列出來。1.所有我們要寫的單選框、復選框、文本域等等，全部要寫在<form>里面。<form method="傳送方式" action="服務器文件">...</form>2.當type="text"時，為文本輸入框；當type="passWord"時，為密碼輸入框。<input type="text/password" name="名稱" value="文本" />3.這是文本域。<textarea rows="行數(shù)" cols="列數(shù)">會出現(xiàn)在文本域的提示文字</textarea>4.當type="radio"時，為單選框；當type="checkbox"時，為復選框。要注意一點，單選框的name一定要相同才能起到單選的作用。<input type="radio/checkbox" value="值" name="名稱" checked="checked"/>5.這是下拉列表框。<select multiple="multiple"> <option value="向服務器提交的值” selected="selected">選項</option> ....</select>注意點：（1）multiple該部分可以不寫，寫了有什么作用呢，可以進行多選，本來下拉框你只能選一個，加了這個之后，在Windows操作系統(tǒng)中，按住control鍵可以進行多選；在 mac中，按住command鍵可以進行多選。 （2）select該部分是指，在沒有選擇的情況下，系統(tǒng)默認選擇的選項。6.這是提交鍵。<input type="submit" value="提交">7.這是重置鍵。<input type="reset" value="重置">8.這是<label>標簽，它本身不會呈現(xiàn)效果，但是有了該標簽，如果你在label標簽內(nèi)點擊了該文本，會自動對焦到相應的表單控件，所以可以直接<label>...</label>用也可以但是沒有此效果了。<label for="控件id名稱">四 .實例介紹
我現(xiàn)在準備做一個表格，讓客戶填寫，在沒有css樣式的情況下，那么這是一張毫無美感的網(wǎng)頁，但是已經(jīng)具備了基本的功能。代碼如下：<html> <head> <title>TODO supply a title</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <body> <div id="sign"> <h1>Sigh Up</h1></br> <h2>Your basic info</h2> <form> <strong>Name:</strong> <input type="text" name="myname" id="name"/></br> </br> <strong>Passward:</strong> <input type="password" name="mypassward" id="passward"/></br> </br> <strong>Age:</strong></br> <input type="radio" name="age" value="1" checked="checked"/>Under 13</br> <input type="radio" name="age" value="2" />13 or older</br> </br> <strong>Your profile:</strong></br> <textarea cols="50" rows="4" name="profile" id="profile"></textarea></br> </br> <strong>Job Role:</strong></br> <select> <option value="Front-End Developer" selected="selected" name="job">Front-End Developer</option> <option value="Back-End Developer" name="job">Back-End Developer</option> </select></br> </br> <strong>Interests:</strong></br> <input type="checkbox" name="development" value="1" checked="checked">Development</br> <input type="checkbox" name="design" value="2" >Design</br> <input type="checkbox" name="business" value="3" >Business</br> </br> <input type="submit" name="Sign Up" value="Sign Up" id="sub" onclick="abc()"> </input> </form> </div> </body> </body> </html>運行代碼后的效果圖：
新聞熱點
疑難解答
