「AWEI」html5+css3技術之段落標記的基本css樣式、鏈接網頁變網站-路徑問題

px 和 em的區別：

px:固定像素值，不改變

em：根據瀏覽器字體大小放大縮小

例子：

font-size: px,pt,em,%

body{font-size:100%} /*等同於16px;*/

h1{font-size:1.375em;} /*22/16*/

預覽效果：

筆者以火狐瀏覽器為例，修改字體大小：

color backgroud

#RGB（紅 綠 藍）：color:#5b820f

rgb(r,g,b):color:rgb(255,0,0);

rgba(r,g,b,a):color:rgba(102,51,53,0.7); /*alpha 0-1 數值 ：指的是透明度*/

預覽效果：

text-shadow

text-shadow:#333 10px 5px 1px; /*給文字設置陰影*/

text-shadow:rgb(153,51,0,0.7) 5px 5px 5px;

預覽效果：

text-transform /*文本大小寫轉換*/

capitalize:文本中的每個單詞以大些字母開頭；

uppercase:定義僅有大寫字母

lowercase:定義無大些字母，僅有小寫字母

inherit:規定應該從父元素繼承text-transform屬性的值

預覽效果：

Transform:rotate(20deg) /*旋轉*/

-moz- transform: rotate(20deg); /*火狐瀏覽器*/

-ms- transform:rotate(20deg) ; /*IE9*/

-o- transform:rotate(20deg); /*opera*/

-webkit- transform:rotate(20deg) ; /*谷歌瀏覽器*/

預覽效果：

transition

預覽效果：

點擊後：

文件路徑 –>相對路徑、絕對路徑

頁面間鏈接

文件下載鏈接

錨點

郵箱

URL(Universal Resources Locator)用於定位Web上的文檔信息

一個URL包括3部分：

協議、計算機地址、文件路徑

協議：//計算機/文件路徑/ 文件名

超鏈接

預覽效果：

頁面鏈接

新建四個頁面first.html \second.html\ three.html\index.html

預覽效果：

不同類型的超鏈接：

根據超鏈接的目標文件不同，分為；

---網頁之間的超鏈接

---頁面內的超鏈接

---文件下載超鏈接

---email超鏈接

---空超鏈接

預覽效果：

創建錨點超鏈接

使用頁面的超鏈接，首先需要定義錨點，然後在超鏈中指向該錨點。

定義錨點應使用<a name=xxx></a>

指向錨點的超鏈為：<a href=#錨點名稱>link</a>

預覽效果：

<iframe> 標籤

預覽效果：

<iframe> 常用在什麼情況

用戶在數據統計 用戶投訴 等多頁面都要顯示的情況；

例如：用戶投訴

預覽效果：

本號所有文章都經筆者親自測驗後整理成稿，期間耗費了很多精力，如果有朋友想收錄自己的博客中請聯繫筆者「壘碼大叔」；

初入IT世界的小白，歡迎大神留言交流，你的互動，是我成長的動力；

如果覺得分享內容還不錯，就推薦到你的朋友圈吧，讓更多人一起交流和分享;

文章某微同步更新！