HTML css屬性拾遺

2021-09-29 03:08:57 字數 1478 閱讀 5005

container height = child height + margintop + marginbottom + border + padding

max-content 該屬性使得container的高度變成子元件的高度

body本身也是乙個盒模型, 其容器就是window

body : body的js屬性: clientheight就是body的實體高度, window.innerheight = document.body.clientheight + margintop + marginbottom

absolute :  將物件從文件流中拖出,使用left,right,top,bottom等屬性進行絕對定位。而其層疊通過css z-index屬性定義。此時物件不具有邊距,但仍有補白和邊框

relative :  物件不可層疊,但將依據left,right,top,bottom等屬性在正常文件流中偏移位置

注意的是,left(左)和right(右)在乙個物件只能選一種定義,bottom(下)和top(上)也是在乙個物件只能選一種定義。

absolute 以body作為相對布局參考物件, 而relative則使用父節點的參考物件

對於display: block的元素而言,預設情況下,該元素會佔據當前的行剩餘空間。

當設定width: fit-content屬性時,元素將會佔據所有寬度,且margin-right不起作用

inline元素的高度和寬度預設是auto, 即完全取決於子元素。 如果inline元素的子元素是block,則整個外部inline元素表現就像乙個block元素一樣;子元素會佔據一行。

block元素:width+margin=父元素行寬,且width最大化,如果width調整,margin會補充上去。假如設定width:fit-content; margin-right: 0, 則其中margin-right的設定不起作用,它會佔據剩餘的空間;假如設定margin-right:0,則width自動擴充為剩餘寬度,即佔滿父容器寬度。

上面的例子說明了:如果同時設定了widthmarigin,無論先後順序是什麼,width都將生效,而margin則根據上面的約束進行計算,從而忽略設定的值。

webkit CSS屬性拾遺

這個偽類用於設定輸入框placeholder文字的樣式,基本可以設定例子如下 input webkit input placeholder這個偽類顧名思義就是給文字描邊的意思,跟text shadow有一定的相似之處。可以用於定義文字描邊的寬度和顏色,還是用乙個例子說明 stroke這第三個屬性就厲...

CSS user select屬性拾遺

昨天把notebook整理了一下,去查了一下手冊,原來之前比較忽略user select這個屬性,因為之前以為只有webkit才支援的。手冊進行了補充 user select禁止使用者選中文字 none 文字不能被選擇 text 可以選擇文字 all 當所有內容作為乙個整體時可以被選擇。如果雙擊或者...

asp知識拾遺

最近做的乙個小 碰到了許多問題,能解決的都解決了,還有的沒辦法就找了替代的解決辦法.下面收集一下 1 在選擇了一系列的checkbox後的提交表單提交後,會獲取到name1,逗號,空格,name2,逗號,空格,結果,系統需要獲取這些值,我用了以下 實現.uname request.form user...