2020 0330知識總結

2021-10-04 13:44:30 字數 1714 閱讀 3019

回顧:

(1) 定位屬性:position

屬性值:static(預設定位)

absolute(絕對定位)

relative(相對定位)

包含塊設定:

給父元素新增position:relative;形成參照物。

給子元素新增position:absolute;進行位置移動。

定位層次關係:z-index:(屬性值為數字,數字越大越靠上)

(2) 絕對定位與相對定位的區別:

1:參照物:

絕對定位參照物:已經新增定位的父元素

相對定位參照物:自身預設的位置

2:布局流:

絕對定位不佔據空間。脫離布局流。

相對定位佔據空間,不脫離布局流。

一、固定定位

屬性:position:;

屬性值:fixed

參照物:以整個瀏覽器視窗為參照物。

特點:不佔據空間,脫離布局流。

讓乙個元素在瀏覽器視窗中上下左右居中:

辦法1:position:fixed;

left:50%;right:50%

margin-left:-元素寬度一半;

margin-right:-元素高度一半;

辦法2:position:fixed;

left:0;right:0;

bottom:0;top:0;

margin:auto;

二、粘性定位

屬性:position:;

屬性值:sticky

執行邏輯:預設情況下,當瀏覽器視窗滾動條不滾動,當前元素沒有超出整個瀏覽器視窗的時候,執行的position:relative;如果元素超出當前視窗則應用的是position:fixed;

注:如果塊狀元素沒有設定寬度的時候,新增position:absolute;或者position:fixed;出現寬度被內容撐開。

三、錨點

超連結的一種。

作用:能實現在同乙個頁面內實現不同位置的跳轉。

描述:讓錨點繫結id名稱的元素回到瀏覽器視窗的最頂端。

< 標籤 id=」」>< /標籤》

< a herf=」#繫結元素的id名稱」>< /a>

四、pc端寬高自適應

pc端寬度和高度的自適應問題:

之前的專案寬度和高度都是固定的寬高。

有時候我們希望,寫html結構的寬和高,能適應不同的解析度,不同的裝置,不同的內容增刪,使我們的專案更加的靈活。

1:寬度自適應

預設情況下塊狀元素,當width(寬)不設定的時候,或者width:100%;當前元素的寬跟隨父元素的變化。

2:高度自適應

高度自適應第一種情況:

需求1:當內容增加的時候 ,內容能把容器撐開。

需求2:當內容極少或者沒有內容的時候,讓容器保持乙個最小高度。

(1) 當元素height(高)不去設定或者是設定成height:auto;元素高度是被內容撐開的。(該方法只能滿足需求1)

(2)最小高度設定:

min-height:;

能滿足需求1和需求2。

拓展(了解):

min-height:; ie的低版本不支援。

但是,ie6預設的會把height解析成最小高度。

刷題 阿里20200330筆試

目錄 第1題第2題 總結 小強有n個養雞場,第i個養雞場初始有a i 只小雞。與其他養雞場不同的是,他的養雞場每天增加k只小雞,小強每天結束都會在數量最多的養雞場裡賣掉一半的小雞,假如乙個養雞場有x隻雞,則賣出後只剩下x 2 向下取整 隻雞。問m天後小強的n個養雞場一共多少只小雞?最後幾分鐘a了,很...

2020 03 30 事情就怕太容易而看不起

22 30 我努力的方向就是要讓一切變得簡單而合理。亨利 福特 要把一件事情做簡單就已經不是一件簡單的事情。如果還要做得合理,好像很不簡單一樣。這是我正常的第一反應,如果我不對自己許多的這些第一反應追加思考,我會把一切原本可以很簡單的事情,被自己的情感上的主觀弄得像電視劇集一樣複雜。所以,想要把事情...

SQL知識總結

use tablename 要操作的資料庫名 select logicalfilename tablename log 日誌檔名 maxminutes 10,limit on time allowed to wrap log.newsize 1 你想設定的日誌檔案的大小 m setup initia...