HTML5 和 CSS 基礎知識一（筆記）

一、HTML5 部分

1、入手

2、html5 語法

3、結構

4、文本格式

5、圖像與畫布

6、列表

7、表格

8、鏈接

9、表單

10、音頻與視頻

11、HTML5其他功能

12、HTML5綜合

二、CSS 部分

1、初識 CSS

2、CSS 基礎語法

3、CSS 基礎選擇器

4、CSS 高級選擇

5、顏色

6、文本修飾

7、邊框效果

8、背景修飾

9、盒子模型

10、浮動和分欄

11、定位

12、過渡效果

13、響應式佈局

14、動畫

15、前端程序與CSS

16、HTML5 和 CSS 綜合

三、需要精通HTML和CSS的崗位

需要精通 HTML

網站開發前端開發工程師

網站開發工程師

網頁設計師

需要精通 CSS

前端開發工程師

網頁設計師

四、網絡基礎知識

該知識點包含內容

1、互聯網

2、ISP與機房類型

3、萬維網

4、URL

5、Tim Berners Lee

6、W3C

URL

英文全稱：Uniform Resource Locator

統一資源定位符

包含了定位Webu資源的足夠信息

如 http:// www.baidu.com/index.html

萬維網是依靠互聯網而生的一種服務，它的典型特徵是通過流利器打開網頁

HTML等標準是由W3C負責維護的

URL就是可以指向特定萬維網資源的網址

web 方式 和 CS 方式

web 方式

world wide web ---網頁方式

B/S 方式

如mail.qq.com/baidu.com等

CS 方式

client software ---客戶端軟件方式

C/S方式

如電腦版qq，手機原生APP等

與原生程序相比，web方式的優勢

2、通用、兼容、跨平臺

3、繞過應用市場，實時發佈，快速迭代

4、易推廣傳播快

劣勢

HTML 標準仍待更新

瀏覽器性能待提升

網速問題

安全問題

按使用情境，網絡應用可分為web 方式與CS方式

從數據交互的角度，也可以稱作為B/S方式與C/S方式

WEB 方式有天生優勢，具備很大潛力，但是目前體驗還需提升

----------

瀏覽器 ---- 知識點包含內容

1、瀏覽器是什麼

2、瀏覽器市場份額

3、瀏覽器兼容問題

web 瀏覽器 --- 是一個應用程序，作用是解釋 和顯示在www 上找到的文檔。

網站開發需要考慮瀏覽器的市場份額

https://tongji.baidu.com/research/site?source=index#browser

兼容性問題

一個網頁"網頁學習班"在不同瀏覽器中打開

瀏覽器兼容性問題涉及到的知識點很多

屏幕分辨率與網頁佈局方式

1、屏幕分辨率

2、固定版式

3、流式佈局

4、響應式佈局

五、HTML 入手

emphasize

標籤 em

用法格式和 strong 完全一樣，在網頁裡使用 em 標籤。

需要強調的內容

break

或
---- 是能 換行

--- URL改成網址如http://www.baidu.com

一個標籤可以有多個屬性

marquee 標籤

strong 和 em 的使用方法是相同的，

我們可以把格式用在 marquee 上，

請在合適的地方使用 marquee 標籤

<marquee>這是飛的感覺/<marquee>

1、需要被重點突出的內容

2、需要被強調的內容

3、

4、<marquee>跑馬燈文字/<marquee>

html 的基本語法公式

內容標籤>

如：

對 marquee 標籤進行改造

就像a擁有href等屬性一樣，marquee也擁有自己的眾多屬性，direction （方向）就是其中一個， 其屬性值可以指定為以下四種之一：

up --- 向上

right --- 向右

down --- 向下

left --- 向左

如：

<marquee>這是浮動效果/<marquee>

繼續對 marquee 進行改造

使用以下屬性與屬性值對 marquee 進行改造

屬性 屬性值

direction up | right | down | left

onmouseover stop(); --- js 語句

onmouseout start(); --- js 語句

<marquee>繼續對 marquee 進行改造效果/<marquee>

閱讀更多 卓帥成長史OL 的文章

關鍵字: 軟件 網頁設計 CSS