HTML簡單入門內容

時間 2020-01-28

標籤 html 簡單入門內容欄目 HTML 简体版

原文原文鏈接

經常使用屬性:
Width=寬度
Height=高度
Size=大小
Color=顏色
Align=佈局方向,值包括(top,bottom,left,right,center)上，下，左，右，中。
Border=邊框大小
Title=提示文字
Href=鏈接路徑
Src=資源路徑
Bgcolor=背景顏色 php

經常使用標籤:
1.
換行標籤
2. <p>  段落標籤
3. 粗體顯示
4. 斜體顯示
5. <u>刪除線</u>
6. 超鏈接標籤,href=鏈接地址,Target=是否新建頁面打開,title=提示文字
例:<a href="http://www.baidu.com" Target="_blank" title="鏈接百度">百度
7. 滾動標籤,scrollamount=滾動速度,align=滾動方向,值包括(top,bottom,left,right,)上下左右
例:<marquee scrollamount="20" align="left">公告通知:開始正式運營</marquee>
8. 水平線標籤,size=線條粗細,color=線條顏色,width=100%:表示瀏覽器滿屏顯
示,100px:表示瀏覽器100個像素顯示
例:<hr size="1" color="red"  width="100%"/>

9. body標籤有且只能有一對,此標籤屬性一改,整個頁面都會改變.bgcolor=背景顏
色,background=背景圖片
例:<body bgcolor="#990000" background="123.jpg">
10. 表格標籤,如下表格爲三行三列,table表格標籤,tr行標籤,td列標籤,這些標籤都是成對出現的,有開始就必須有結束.border=表格邊框大小,cellspacing=表格間距大小,cellpadding=表格填充大小
例:<table width="300" border="1" cellspacing="0" cellpadding="0">
　　　　<tr>
    <td> </td>
<td> </td>
<td> </td>
　　　　</tr>
　　　　<tr>
    <td> </td>
<td> </td>
<td> </td>
　　　　</tr>
　　　　<tr>
    <td> </td>
<td> </td>
<td> </td>
　　　　</tr>
</table>
11. 表格跨行跨列,此例依舊是三行三列：
第一行的第1列跟第2列合併,colspan=2爲跨2列;
第二行第3列跟第三行第3列合併,rowspan=2爲向下跨2行;
例:<table width="300" border="1" cellspacing="0" cellpadding="1">
<tr>

<td colspan="2"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>

<td rowspan="2"> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
12. 字體標籤，size=字體大小，color=字體顏色 css

例：<font size="+2" color="#990000">紅色5號字體</font>

13. CSS樣式，如下代碼就是一個定義樣式的模版，<style type="text/css">但凡定義的樣式都要寫在這對標籤裏面纔會生效，而style標籤必須在<head>標籤裏面寫。這裏定義的Td樣式前面是沒有加點的，這表示網頁內全部td標籤都會用此樣式，並且不須要通過class調用.這裏自定義了Cs1，注意前面是加點的，那麼說明這個樣式必須用class調用
例：<style type="text/css">
 Td{ border:#0000FF solid 1px;}

.Cs1{ font-size:14px; font-family:"宋體"; color:#FF0000} </srtpe>

<span class="Cs1">學習編程，美好將來</span>
 <table> <tr>
<td>123456</td> </tr> </table>
14. 內嵌樣式定義，簡單的樣式咱們能夠經過標籤內style屬性定義，效果跟13例子同樣例：<span style=" color:#990000; font-size=:18px">紅色18號字體</span>
15. 圖片，src=圖片路徑，width=圖片寬度，height=圖片高度，高寬不寫爲默認大小 
例1：<img src="image/text.jpg" width="120" height="80" /> 
例2：<img src="http://www.baidu.com/img/baidu_sylogo1.gif" />
轉載於猿2048:➧《HTML簡單入門內容》編程

1. HTML簡單入門
2. HTML --- 簡單入門
3. HTML初級入門內容
4. HTML簡單入門(一)
5. html與css簡單入門
6. html 表單input錄入內容校驗
7. 簡單介紹HTML的入門
8. OSI簡單內容
9. HTML極簡入門學習
10. HTML學習（二）Echarts入門——html實現簡單echarts圖例
更多相關文章...
• Memcached入門教程 - NoSQL教程
• Eclipse 內容輔助 - Eclipse 教程
• YAML 入門教程
• Java Agent入門實戰（一）-Instrumentation介紹與使用

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。