Web前端開發技術項目教程（HTML5 CSS3 JavaScript）（微課版） 課件 5.1.8技能點4如何選擇合適的CSS引入方式_第1頁
Web前端開發技術項目教程（HTML5 CSS3 JavaScript）（微課版） 課件 5.1.8技能點4如何選擇合適的CSS引入方式_第2頁
Web前端開發技術項目教程（HTML5 CSS3 JavaScript）（微課版） 課件 5.1.8技能點4如何選擇合適的CSS引入方式_第3頁
Web前端開發技術項目教程（HTML5 CSS3 JavaScript）（微課版） 課件 5.1.8技能點4如何選擇合適的CSS引入方式_第4頁
Web前端開發技術項目教程（HTML5 CSS3 JavaScript）（微課版） 課件 5.1.8技能點4如何選擇合適的CSS引入方式_第5頁
已閱讀5頁，還剩7頁未讀， 繼續免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

如何選擇合適的CSS引入方式信息安全技術應用ApplicationofInformationSecurityTechnology《前端技術開發》前端技術開發知識儲備內部樣式表1鏈入外部樣式表2導入外部樣式表3嵌入樣式表4內部樣式表前端技術開發01任務目標：使用CSS美化下面的表格。<tableborder="1"><trid="head"><th>排名</th><th>品牌</th><th>車型</th><th>銷量</th></tr><tr><td>1</td><td>比亞迪</td><td>秦PLUS</td><td>27851</td></tr><tr><td>2</td><td>特斯拉</td><td>ModelY</td><td>22537</td></tr></table>內部樣式表前端技術開發01使用內部樣式表，在<head>標記里寫入。

<style>table{text-align:center;width:600px;height:200px;}tr#head{background-color:aqua;height:40px;}</style>內部樣式表前端技術開發01內部樣式表的特點：優點：結構和樣式分離，架構清晰，利于后期代碼維護。可以批量設置選中的標簽樣式；缺點：結構和樣式沒有完全分離鏈入外部樣式表前端技術開發02<linkrel="stylesheet"type="text/css"href="login.css">@charset"utf-8";table{text-align:center;width:600px;height:200px;}tr#head{background-color:aqua;height:40px;}準備login.css樣式文件在html文件的<head>中引入此文件。導入外部樣式表前端技術開發03<styletype="text/css">@importurl("login.css")</style>@charset"utf-8";table{text-align:center;width:600px;height:200px;}tr#head{background-color:aqua;height:40px;}準備login.css樣式文件在html文件的<head>中導入此文件。導入外部樣式表前端技術開發03優點：結構與樣式分離，方便、簡潔缺點：樣式一經加載將全局生效，類名相同時樣式之間會互相影響外部樣式表的特點：嵌入樣式表前端技術開發04<tableborder="1"style="text-align:

center;width:600px;height:200px;"><trstyle="background-color:aqua;height:40px;"><th>排名</th><th>品牌</th><th>車型</th><th>銷量</th></tr><tr><td>1</td><td>比亞迪</td><td>秦PLUS</td><td>27851</td></tr><tr><td>2</td><td>特斯拉</td><td>ModelY</td><td>22537</td></tr></table>直接在html中將樣式寫在對應標記的style屬性中。嵌入樣式表前端技術開發04優點：樣式之間不會有沖突缺點：某些樣式編輯器沒有提示結構與樣式沒有分離性能上稍差嵌入樣式表的特點：小結前端技術開發031.嵌入樣式表沒有做到結構與樣式分離。2.內部樣式表將結構與樣式進行了不完全分離，而且只對其所在的HTML頁面有效，不能重用于多個頁面。3.外鏈式與導入式都是引入外部CSS文件，但大多數網站都是采用外鏈式來引入外部CSS樣式表。主要原因是兩者的加載時間和順序不同，在一個頁面被加載時，由外鏈式引入的樣式表會被同時加載，而由導入式引入的樣式

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間，僅對用戶上傳內容的表現方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容，請與我們聯系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論