Web基礎(chǔ)知識
Web與Internet
Web的工作原理
Web的相關(guān)技術(shù)
HTML快速入門
HTML概述
- 超文本
- 什么是HTML
HTML基礎(chǔ)語法
標(biāo)記語法,HTML用于描述功能的符號稱之為“標(biāo)記”，比如
<p>,<h1>
標(biāo)記要用尖括號括起來,有封閉型標(biāo)記（雙標(biāo)記）和非封閉型（單標(biāo)記）標(biāo)記
<biaoji>content</biaoji>
<biaoji>或者<biaoji/>元素,元素即標(biāo)記
每一對尖括號包圍的部分,如<body></body>中包圍的部分叫元素,元素可以包含文本內(nèi)容和其他元素，也可以是空的元素嵌套,元素之間可以互相嵌套形成復(fù)雜的語法
如
<body>
<p></p>
</body>
注意：
1.注意嵌套的順序
<div><a></a></div>.............正確
<div><a></div></a>..............錯誤
2.用縮進表示層級關(guān)系
<div>
<a>
<b>
</b>
</a>
</div>
-
屬性和值
1.屬性用來修飾元素
屬性的聲明必須寫在開始的標(biāo)記里面
一個元素的屬性可以不止一個，多個屬性用空格隔開
多個屬性之間是不分先后順序的2.每個屬性都有值
屬性和值之間用等號連接
屬性的值包含在引號中間,單引號或者雙引號
如<p align="center">hello</p> 標(biāo)準(zhǔn)屬性,每個元素都有自己所特有的屬性
有些屬性是絕大多數(shù)元素都支持的屬性，成為標(biāo)準(zhǔn)屬性和通用屬性
id （作用:定義元素在頁面中的獨一無二的標(biāo)識）
title （作用：鼠標(biāo)移入時所提示的文字）
class （作用：引用類選擇器）
style （作用：定義內(nèi)聯(lián)樣式）
-
注釋
被注釋的東西是不會被瀏覽器所解釋的
注意：
1.注釋不可以嵌套再其他注釋中(錯誤示范)<!-- <--! --> -->2.注釋不能出現(xiàn)在標(biāo)記中中（錯誤示范）
<p <--! --> >你好</p> HTML和XHTML
待補充HTML5
待補充
文檔結(jié)構(gòu)
文檔類型聲明
文檔類型說明的作用：指定網(wǎng)頁版本和風(fēng)格
文檔類型聲明：在文檔的起始用DOCTYPE聲明指定的版本和風(fēng)格
在html5中：<!doctype html>
文件頭<head></head>
文檔主體部分<body></body><html>元素
作用：描述整個html網(wǎng)頁的內(nèi)容,含有兩個子元素(head元素、body元素)<head>元素
作用：用于為頁面定義全局信息
所有其他頭元素的容器,緊跟在起始標(biāo)簽<html>之后
例如：
<head>
<title>HTML文檔</title>
<meta name="keywords" content="html,css"/>
<script type="javascript"></script>
<style type="text/css"></style>
</head>
- 文檔頭部內(nèi)容<title>
作用：網(wǎng)頁標(biāo)題<title></title>
標(biāo)題元素的內(nèi)容出現(xiàn)在瀏覽器頂部,沒有屬性,必須出現(xiàn)在<head>元素中
一個文檔只能有一個標(biāo)題元素
- 文檔頭部內(nèi)容<meta>
元數(shù)據(jù)元素<meta>用于定義網(wǎng)頁的基本信息,為空標(biāo)記
常用的屬性有：content、http-equiv
<head>
<title>HTML文檔</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
<meta name="keywords" content="html,css"/>
</head>
<style>定義內(nèi)部樣式表
<link>引入外部樣式表
<script>聲明或引入JS代碼（文件）
<body>元素
包含網(wǎng)頁要顯示給讀者的內(nèi)容，稱為主體內(nèi)容
包含除了html、head外的所有元素
語法：<body></body>
文本
- 文本標(biāo)記概述
1.文本標(biāo)記作用
包含在標(biāo)記中的文本會被顯示為所擁有的樣式:特殊字符、注釋、標(biāo)題元素、段落元素、換行元素、分區(qū)元素等。
2.文本與特殊字符
多個空格最終只會顯示單個空格，所以需要進行轉(zhuǎn)義
特殊字符需要用字符實體進行轉(zhuǎn)義
<為<,
>為>,
空格為 ,
一個圈圈一個c叫做copyright為©
￥為¥
- 使用文本標(biāo)記
1.文本樣式
文本樣式的作用是對文本進行修飾
<b></b>加粗
<i></i>傾斜
<u></u>下劃線
<s></s>刪除線
<sup></sup>上標(biāo)
<sub></sub>下標(biāo)
2.標(biāo)題元素<hn>
<hn>...<hn> n=1,2,3,4,5,6
作用：讓文字以更醒目的方式顯示
效果：改變文字大小，加粗，以及上下垂直空白距離
3.段落元素<p>
<p></p>元素中的文本會用單獨的段落顯示
與上下文本換行分開
添加一段額外的垂直空白距離，作為段落間距
常用屬性：align（控制段落標(biāo)題的文本水平對齊方式）
- 換行元素
<br>
使用<br>元素在任何地方創(chuàng)建手工換行
5.分區(qū)元素<span>和<div>
分區(qū)元素常用于頁面布局
塊分區(qū)元素<div></div>
行內(nèi)分區(qū)元素（設(shè)置同一行文字內(nèi)的不同格式）：<span></span>,就是一行文字里面，我想要這其中的幾個字有比較特殊的樣式
- 行內(nèi)元素和塊級元素
行內(nèi)元素：不會換行，可以和其他行內(nèi)元素位于同一行里
如<span><b><i><u>
塊級元素：獨占一行，元素前后都會自動換行
7.分隔線元素<hr>
<hr>在頁面上創(chuàng)建一條水平線
常用屬性：
size 尺寸
width 寬度 默認100%
align 對齊方式
color 顏色
- 預(yù)格式化
<pre>
保留源文檔中的格式，也就是本來有換行的保持換行，本來有空白的地方保留空白
