版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)
文檔簡(jiǎn)介
《web前端》課程任課教師：元素定位任務(wù)：二級(jí)導(dǎo)航的制作任務(wù)展示二級(jí)導(dǎo)航的實(shí)現(xiàn)2第一部分Knowledge元素的定位屬性1.定位方式-position在HTML中，可以使用CSS來對(duì)元素進(jìn)行定位，定位方式屬性用于設(shè)定瀏覽器應(yīng)如何來定位HTML元素。定位屬性定位一語法：position：static|absolute|fixed|relative2.元素位置top、right、bottom、left元素位置屬性與定位方式共同設(shè)置元素的具體位置.語法：top：auto|px|%共同定義1.定位方式-position：static定位屬性定位一static為默認(rèn)值。表示沒有定位，元素出現(xiàn)在正常的文檔流中(忽略top屬性、bottom屬性、left屬性、right屬性或者z-index屬性)。元素會(huì)按照HTML文檔中的順序顯示。2.定位方式-position：relative定位屬性定位一relative表示采用相對(duì)定位，對(duì)象不可層疊，但將依據(jù)left、top、right、bottom等屬性設(shè)置在頁面中的偏移位置。(即在文檔中仍占據(jù)原來的位置）仍占據(jù)原來的位置3.定位方式-position：absolute定位屬性定位一絕對(duì)定位是將元素依據(jù)最近的已經(jīng)定位(絕對(duì)、固定或相對(duì)定位)的父元素進(jìn)行定位，若所有父元素都沒有定位，則依據(jù)body根元素(瀏覽器窗口)進(jìn)行定位。當(dāng)position屬性的取值為abso1ute時(shí)，可以將元素的定位模式設(shè)置為絕對(duì)定位。4.定位方式-position：fixed定位屬性定位一fixed總是根據(jù)瀏覽器的窗口來進(jìn)行元素的定位，且不會(huì)隨著滾動(dòng)條的滾動(dòng)而改變。拖動(dòng)滾動(dòng)條，盒子位置不變層疊順序?qū)傩杂糜谠O(shè)定層的先后順序和覆蓋關(guān)系，該屬性實(shí)際是設(shè)置元素沿z軸的位置。默認(rèn)情況下，z-index值為1，擁有更高堆疊順序的元素總是會(huì)處于堆疊順序較低的元素的前面?！救≈礱uto表示遵從其父對(duì)象的定位；取數(shù)字值是必須是無單位的整數(shù)值，可以取負(fù)值?！孔⒁猓罕緦傩灾粚?duì)設(shè)置了定位屬性的盒子才起作用。語法：z-index:auto|數(shù)字說明：z-index值高的層覆蓋z-index值低的層。一般情況下，z-index值為1，表示該層位于最下層。層疊順序設(shè)置二1.層疊順序z-index。層疊順序設(shè)置二1.層
溫馨提示
- 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會(huì)有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲(chǔ)空間，僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請(qǐng)與我們聯(lián)系，我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。
最新文檔
- 2025年植物促生菌劑項(xiàng)目合作計(jì)劃書
- 2025屆黑龍江龍東高中十校聯(lián)盟高三下學(xué)期2月適應(yīng)性考試生物試題及答案
- 2024重慶鐵路綜合交通樞紐有限公司招聘12人筆試參考題庫附帶答案詳解
- 迪拜農(nóng)產(chǎn)品（果蔬）市場(chǎng)前景及行業(yè)趨勢(shì)分析報(bào)告
- 2025商業(yè)廣場(chǎng)春季櫻花游園嘉年華（花開爛漫 只櫻有你主題）活動(dòng)策劃方案-44正式版
- 2024湖北恩施市福牛物業(yè)有限公司補(bǔ)招湖北硒恩城市建設(shè)集團(tuán)有限公司下屬子公司人員筆試參考題庫附帶答案詳解
- 廣東省梅州市2025屆高三一模化學(xué)試卷（原卷版+解析版）
- 2025至2031年中國廣味白醋行業(yè)投資前景及策略咨詢研究報(bào)告
- 2025至2030年中國自動(dòng)無功補(bǔ)償裝置數(shù)據(jù)監(jiān)測(cè)研究報(bào)告
- 2025至2031年中國雨裝行業(yè)投資前景及策略咨詢研究報(bào)告
- （一模）東北三省三校2025年高三第一次聯(lián)合模擬考試 生物試卷（含答案）
- 污水處理廠工程設(shè)備安裝施工方案及技術(shù)措施
- 2025年海南?？谑兴畡?wù)局招聘事業(yè)單位人員35人歷年高頻重點(diǎn)模擬試卷提升（共500題附帶答案詳解）
- 交警大隊(duì)合同范本
- COP生產(chǎn)一致性控制計(jì)劃
- 產(chǎn)業(yè)轉(zhuǎn)移課件-2024-2025學(xué)年高三一輪復(fù)習(xí)人教版（2019）地理選擇性必修2
- 2025年02月中國科協(xié)所屬單位公開招聘社會(huì)在職人員14人筆試歷年典型考題（歷年真題考點(diǎn)）解題思路附帶答案詳解
- 2025-2030年中國電動(dòng)滑板車市場(chǎng)運(yùn)行動(dòng)態(tài)及發(fā)展規(guī)劃分析報(bào)告
- 中考英語專題總復(fù)習(xí)-題型9省公開課一等獎(jiǎng)百校聯(lián)賽賽課微課獲獎(jiǎng)?wù)n件
- 2025年電力人工智能多模態(tài)大模型創(chuàng)新技術(shù)及應(yīng)用報(bào)告-西安交通大學(xué)
- 天津2025年天津市機(jī)關(guān)后勤事務(wù)服務(wù)中心分支機(jī)構(gòu)天津市迎賓館招聘2人筆試歷年參考題庫附帶答案詳解
評(píng)論
0/150
提交評(píng)論