2015年10月15日學習html基礎筆記

時間 2019-11-25

標籤 2015年 10月 15日學習 html 基礎筆記欄目 HTML 简体版

原文原文鏈接

一個互聯網公司的分工，小公司要求全能，拿一個項目所有作出來。大公司分工明細，主要步奏爲策劃人員策劃方案，美工人員設計圖有.psd.rp等，前端人員作靜態頁面，後臺人員獲取數據java php .net。不管是處於那塊的人員，都要對於其餘的有所瞭解。javascript

www網頁服務，FTP文件上傳下載，telnet遠程控制php

Apache2.2服務器css

windows+r=運行，輸入services.msc調出服務控制檯html

本地：127.0.0.1，訪問本身本地服務器，須要使用Apache架起服務器以後，將文件放置到htdocs文件夾當中。安裝Apache時要注意不能有中文文字不能有空格，能夠直接安裝到C盤下，不要安裝到默認文件夾中。前端

主要使用的測試瀏覽器有IE、firefox、chrome、opera、safarihtml5

服務器端技術與客戶端技術java

常見的服務器端技術（運行在服務器上）：web

JSP/PHP/ASPXchrome

（前端）常見的客戶端技術（運行在瀏覽器上）：windows

HTML/CSS/JS/SWF（flash）

計算機語言，HTML與JAVA/C/PHP不一樣，一門語言有三種結構，順序執行、循環執行、選擇執行。HTML裏沒有循環、選擇等基本結構，只有純文本和52個標籤。

雙標記標籤：<標籤名>文本</標籤名>

單標記標籤：<標籤名/> 單標記標籤中不能包含內容

<hr/>水平線<br/>換行

Meta標記的使用

設置描述：<meta name=」description」 content=」value」 >

設置做者：<meta name=」author」 content=」做者名」>

設置字符集：<meta http-equiv=」content-type」 content=」text/html;charset=gb2312」/>或者utf-8

gb2312主要用於中文文字較多的，而utf-8是國標，在國際上使用較多。

設置頁面定時跳轉：<meta http-equiv=」refresh」 content=」2;URL=http://www.baidu.com」/>

html與xhtml的區別，xhtml首先全部字母都小寫，其次全部標記都要有關閉。

格式：<標記屬性1=參數1 屬性2=參數2>內容</標記>

不一樣標籤具備不一樣的屬性，全部標籤都具有如下四個屬性：

id：整個文檔每一個標籤能夠聲明一個惟一的id號

style：爲元素指定css樣式

class：指定元素所屬的類型

title:指定標籤的彈出提示語

寫代碼前須要聲明文檔類型，不然會影響到css和javascript的解釋執行，不少效果就會出不來。

文檔類型聲明：（全部工具都能生成這句話）

<!DOCTYPE html PUTLIC 「-//W3C//DTD XHTML1.0 Transitional//EN」「http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd」>

windows+d能夠將桌面調出來。

meta data:元數據-描述數據的數據（視頻1day02視頻1的35分）

轉義字符：

<>正常來講是沒法顯示的，會被認爲是告訴瀏覽器的語言，因此須要使用轉義字符來顯示到前臺。

基本格式：&xxxx

< 是<

> 是>

空格是 

& 是&

™ 是™

® 是&reg；

XHTML中不使用描述樣式，都是使用CSS來控制樣式，而在html中描述樣式和描述語義是混雜的。例如<b>和<strong>，前面是描述樣式，後面是描述語義，在xhtml中<b>描述樣式標籤就不可存在了。xhtml中，<em>代替<i>。

現在新網頁中大多都是用的xhtml，爲何html卻沒被廢棄呢？由於以前不少老網頁沒有修改過，都仍是用的描述樣式的方式，因此沒法廢棄，只是新的再也不使用。

html元素類型，共有100多個元素類型，差很少各佔一半，有的只能用於區塊元素中，有的只能用於內聯元素中。若是區塊元素的用於內聯元素中，那麼效果就不會顯示出來。

區塊元素(block)，必須本身獨立佔一行，例如<div></div>
內聯元素(inline)，本身有多寬就佔多寬，同時也與其餘的處於同一行中。

內聯標籤：<b><strong><i><em><u><s><sub><sup><span><img/><a><input type=」text」/><input type=」submit」/><label><select><textarea>

區塊標籤：<h1>到<h6><div><p><hr><pre><table><ul><li><ol><dl><dt><dd><form>

描述標籤：<b><i><sub><sup><width><color><align>

語義標籤：<p><strong><em><h1>到<h6>

分區元素用於爲元素分組，經常使用與頁面佈局。<span>和<div>

塊分區元素<div></div>，元素分組工具，用於內容分層和頁面佈局，需配合CSS使用

行內分區元素<span></span>需配合css和Js纔有效果

下標字：<sub></sub>

上標字：<sup></sup>

ctrl+d刪除一整行

ctrl+alt+↓複製一整行

標題字在不一樣的瀏覽器默認字體高度、間距都是不同，因此會存在兼容性的問題。要使用css來屏蔽這個問題。

<b/>,在html或者html5中「/」能夠省略，可是在xhmtl中是不能夠省略的。

<hr>分隔線元素，建立一條水平線，經常使用屬性爲（size、width、align、color）

<img/>通知瀏覽器此刻應該向服務器發起一個圖片請求，src指定圖片的URL,alt屬性，若是圖片沒法顯示則顯示此文字來替代。

html頁面中可能用到資源：圖片、css、js、另外一個頁面

web開發用到的圖片格式

bmp:未經壓縮的bit圖，通常不用於web開發

psd：ps的原始文檔，支持層，頁面中不直接使用

tiff：出版印刷

raw：太大

jpeg：通過壓縮的圖片，保真度高，色彩豐富，適用於web中的照片，1024*768大壓縮到100k甚至更小徹底能夠接受

png：色彩沒有jpg豐富，可是透明度支持的好，壓縮比例大，適合於圖標

gif：色彩比較豐富，支持動畫效果，也在必定程度支持透明度。

連接的表現形式

目標文檔爲下載資源<a href=」DAY02.zip」>下載</a>
電子郵件連接<a href=」mailto:balabala@163.com」>聯繫咱們</a>
返回頁面頂部的空連接<a href=」#」>…</a>
連接到javascript<a href=」javascript:…」>js功能</a>

頁面佈局的三種方式：

table的使用主要用於顯示批量的數據，可是做爲頁面佈局已通過時。

div+css如今的主流

html5佈局標籤，將來的趨勢

藍色的是內容所佔區域，橙色的是間距，綠色的是填充。

form表單，用於收集用戶的數據，提交給服務器。有兩個屬性，action是指定表單數據的處理頁面，必須是動態頁面。還有input type。

地址欄url中最多輸入字符不能超過1024個字節。

相關標籤/搜索

每日一句

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