我們首先來看一下成果圖
1、title
<head> <meta charset="UTF-8"> <title>This is a html sample</title> </head>
在head中放進去的title表示網頁的標題
還可以在head放進來的有
base頁面上所有鏈接的默認地址
link與外界資源的鏈接 常鏈接CSS
style定義樣式
meta提供網頁元數據 網頁不可顯 但是機器是可讀的
script定義客戶端的腳本。
2、<p>段落
<p style="font-family: Arial;color: blue">我是一個段落。</p>
3、h標題
從1到6 越來越小
4.表格
<table border="1"> <tr> <th>col 1</th> <th>col 2</th> </tr> <tr> <td>row 1,col 1</td> <td>row 1,col 2</td> </tr> </table>
邊界值border一定要設 沒有表格外面那層線,看起來就不是表格了
5、圖片img
<img src="dog.jpg" alt="可愛小豆的照片" width="300" height="200">
長寬高不需要在style里設置 用width height就可以了
6、超鏈接a
<a href="https://www.cnblogs.com/cckong/">歡迎點擊我的博客</a><br>
7、form表單
<form action="#" method="get"> 姓名:<br> <input type="text" name="name"> <br> 電話:<br> <input type="text" name="tel"> <br> <input type="submit" name="提交"> <br> <input type="reset" name="重置"> </form>
input有很多的類型:
text常規文本輸入
radio單選按鈕輸入
submit提交按鈕(途中的提交和重置是默認的 只要你的type是submit或reset 在網頁就會顯示 提交 重置)
password密碼字段 在網頁中是掩蓋的
image圖像的提交按鈕
在form表單中的
action屬性:提交表單的動作
method提交表單所用的HTTP方法(get post)
name 每個輸入必須對應一個name屬性