1. 程式人生 > >html的基本標籤

html的基本標籤

一.html簡介:

1.html是什麼

1)html是用來描述網頁的一種語言
2)html指的是超文字標記語言
3)不是一種程式語言,而是一種標記語言
4)標記語言是一套標記標籤
5)html使用標記標籤來描述網頁

語言:人和計算機交流的工具
超文字:(1)普通文字不能實現的,超文字可以實現
        (2)包括超連結的汶斌
標記:就是標籤,不同的標籤能實現不同的功能

2.html能做什麼
    html通過標籤的形式將資訊展示給使用者
3.html書寫規範
    需求:寫一段文字
--------------------------
<html>

    <head></head>
    <body>
        啦啦啦<font color="red" size="5">啦啦啦</font>啦,
        <br/>啦
    </body>

(1)html結構


包括資訊資訊:整個頁面的屬性,指導瀏覽器解析的標籤,引入外部檔案的標籤


我們需要展示的資訊


(2)html標籤是一尖括號包裹關鍵字出現的,有開始和結束標籤,支援正確的巢狀
(3)大部分的標籤有屬性 格式:屬性=”屬性值” 多個屬性之間用空格隔開
(4)空標籤,功能比較單一
==

(5)html不區分大小寫,建議使用小寫

二。html基本標籤

1.檔案標籤(結構標籤)
2.排版標籤
3.塊標籤
4.文字標籤
5.清單標籤
6.圖形標籤
7.連結標籤
8.表格標籤

1.檔案標籤(結構標籤)
< html>:根標籤
< head>:
< title>:頁面的標題
< body >:
< body >:內容
屬性: 1).text:文字的顏色
2).bgcolor:背景顏色
3).backgtound:背景圖片

       顏色:(1)單詞:red green black
            (2)rgb三原色:rgb(0,0,0)  0-255
            (3) #000000   #ffffff     #325687(各種各樣程式碼)

2.排版標籤
1)註釋標籤:外部已有
2)換行標籤:< br/ >
3)段落標籤< p >文字< /p > 特點:段落之前有空行
屬性:align 對齊方式:left center right
4)水平線標籤 < hr/ >
屬性:width:長度
size:粗度
color:顏色
align:對齊方式

      尺寸的寫法:
                畫素:10px(不帶單位預設單位是px)
                百分比:佔據副標題的百分比(會根據螢幕寬頻變化而變化)

3.塊標籤

div:行級塊標籤
span:行內塊標籤

作用:div+css分塊
    span進行友好提示

4.基本文字標籤< font >
屬性:
color:顏色
size:大小 (最大值:7 最小值:1 預設值:3)
face:字型型別

  標題標籤:
        < h1 >到< h6 >  大小依次減小,字型預設加粗,預設佔據一行

5.清單標籤
無序列表:< ul >
屬性:type:disc square circle
< li >:列表項

有序列表:< ol >
屬性:type  數字(用數字表示有序),A,a(用abcd表示有序),I,i(羅馬字元)
      start   數字,代表首項開始的位置
      < li >:列表項

作用:做選單

6.圖形標籤:
< img >
src:圖形的地址
width:圖片的寬度
height:圖片的高度
border:邊框
align:對齊方式 代表圖片與相鄰文字的對齊方式 top middle bottom 預設:middle
alt:圖片的文字說明

7.連結標籤
< a >

屬性:href 跳轉頁面的地址
注意:跳轉網際網路資源 前面要加協議http://
name 名稱,名字 錨點
錨點訪問:href標籤;書寫格式:”#name”
target _selt(預設) _blank
作用:
(1)頁面跳轉

8.表格標籤
< table >
屬性:border:表格邊框
width:寬度
align:對齊方式
< tr >代表行
< td >代表單元格 用< th >代替< td >文字加粗
屬性:colspan 列合併 -
rowspan 行合併 |
(加屬性的那個單元格往列或者往行合併,被合
並的單元格算做現在這個單元格所屬,若2-1和
3-1合併,就在2-1對應的td裡面夾rowspan=”2”,
等於多少合併幾個,合併後第三行第一個單元格
是原來的3-2)
< caption >加標題
< bgcolor >背景顏色

作用:(1)簡單的實現一個表格
      (2)進行佈局