本篇文章為大家展示了如何理解黑馬web前端開發(fā)，內(nèi)容簡明扼要并且容易理解，絕對能使你眼前一亮，通過這篇文章的詳細介紹希望你能有所收獲。

鄂托克前ssl適用于網(wǎng)站、小程序/APP、API接口等需要進行數(shù)據(jù)傳輸應(yīng)用場景，ssl證書未來市場廣闊！成為成都創(chuàng)新互聯(lián)的ssl證書銷售渠道，可以享受市場價格4-6折優(yōu)惠！如果有意向歡迎電話聯(lián)系或者加微信：028-86922220（備注：SSL證書合作）期待與您的合作！

黑馬web前端開發(fā)定位的組成

定位布局：定位模式+邊偏移(方向英文更改)

邊偏移：top、bottom、left、right屬性;

定位的精髓：利用更改方向英文來進行位置設(shè)置;

黑馬web前端開發(fā)定位模式

靜態(tài)定位：position:static;

相對定位：position:relative;

參照物：相對于自己去進行位置移動;

相對定位特點：相對于自己為參照物進行位移，屬于占位定位，盒子仍然在標準流里面;

相對定位是不會改變盒子的顯示模式的;

絕對定位：position:absolute;

參照物：絕對定位的參照物默認以父級為主，如果父級沒有定位，就一層一層往上找，如果找不到定位的祖先盒子就以瀏覽器為參照;

注意:絕對定位完全脫離了文檔流;

絕對定位特點：絕對定位是完全脫離了標準流不占位的，參照物默認以父級為主，如果父級沒有定位一層一層往上找，如果找不到定位的祖先盒子就以瀏覽器為參照定位;

子絕父相

布局的時候我們一般是上下布局，如果上邊的盒子用了絕對定位就會脫離文檔流，就會影響下面的布局，所以我們用子絕父相，用了相對定位父級原來的位置是不會改變的;

子級絕對，父級相對，父級盒子定位了，但是依然占位，不會影響其他盒子的布局;

黑馬web前端開發(fā)固定定位：position:fixed

參照物：電腦屏幕(可視窗口);

注意：固定定位完全脫離了標準流，參照物是可視窗口為準，和父級沒任何關(guān)系，IE6不支持固定定位，但是我們現(xiàn)在不用管它，直接使用就可以;

絕對定位的盒子居中對齊(很重要)

絕對定位和固定定位的盒子不能使用margin:auto;設(shè)置水平居中，如果想要居中我們就需要如下設(shè)置：

設(shè)置定位盒子的left :50%; 設(shè)置盒子的margin-left:-自己的寬度的一半，讓盒子水平居中;

設(shè)置定位盒子的top :50%; 設(shè)置盒子的margin-top:-自己的高度的一半，讓盒子垂直居中;

z-index堆疊順序

z-index是定位的z軸顯示，只能用于相對定位、絕對定位和固定定位，數(shù)值越大越靠前，取值沒有單位;

如果沒有定位屬性的話z-index不生效;

定位改變display屬性

相對定位不會改變盒子的顯示模式;

絕對定位和固定定位會將盒子的顯示模式轉(zhuǎn)化成具有行內(nèi)塊元素的特性;

注意：如果給了元素定位屬性，默認的寬度是由內(nèi)容撐開的，所以建議在書寫定位元素的時候盡量自己設(shè)置寬度; 浮動以后的盒子也會改變盒子的顯示模式為具有行內(nèi)塊元素的特性

上述內(nèi)容就是如何理解黑馬web前端開發(fā)，你們學(xué)到知識或技能了嗎？如果還想學(xué)到更多技能或者豐富自己的知識儲備，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

網(wǎng)站名稱：如何理解黑馬web前端開發(fā)-創(chuàng)新互聯(lián)
本文網(wǎng)址：http://www.rwnh.cn/article10/dohjdo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供用戶體驗、網(wǎng)站策劃、面包屑導(dǎo)航、網(wǎng)站設(shè)計、標簽優(yōu)化、域名注冊

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)