寫前端頁面遇到的問題

2021-10-06 16:01:03 字數 1353 閱讀 1813

在div中放了乙個和一段文字時 發現無論怎麼調節img的屬性,和文字都不能具有相同的高度。此時設定img的屬性float浮動即可,可以通過修改margin來改變邊距。

修改div的padding屬性是會改變div的原有大小。給他乙個box-sizing:border-box;就不會改變大小了

如果在父div中有兩個子div那麼子div的寬度之和不要剛好等於符div的寬度。

如果想要實現垂直居中則設定line-height等於div的高度(但是如果是多行的話不行)

給一段文字行高,就會讓這段文字居中。

margin-left:auto,margin-right:auto元素居中僅僅針對塊元素有效.對於無效。但是可以通過display:block實現居中 。

內聯標籤(a,span,em,strong)不可以設定margin,padding ,width,height;塊標籤(div,h1~h6,p,ul,li,dl,dt,dd)獨佔一行,可以設定看寬高,邊距等。

想讓內聯元素和內聯塊元素水平居中 (1)使用display:block;margin-left:auto;margin-right:auto;(2) 給他父親 ,在父元素中使用text-algin:center ;

巢狀的越深,權重越重將盒子的屬性設定成box-sizing:border-box ;在去設定border,padding值是不會改變盒子的height,width.

父元素繼承子元素的高度,如果子元素設定了浮動,父元素就會坍塌,解決方法:給父元素設定overfloat:hidden;

兩個input並列會出先不對齊的現象,可以使用定位解決:positon:absolute;top:0;left:0;

z-index:3;設定定位元素的堆疊。誰的值高誰就在上面。

子元素作為父元素的第乙個元素,給子元素margin-top沒用,問題:子元素沒有移動而是父元素移動了。解決:1.讓他做第二個元素:parent ::before即可,2. 給父元素:overflow:hidden;

兄弟元素之間margin(第乙個元素給margin-button,第二個元素給margin-top重合問題:值一樣取中間值,值不一樣取大的值。

bug:給內聯塊元素margin-top,內聯元素也跟著移動(定位可以解決)

overflow:hidden:溢位隱藏。

子元素float,父元素沒有高度---->1.給父元素overflow:hidden第二種:給偽元素 .row:after

問題:給div設定了100%的寬度,但是頁面出現了橫向滾動條?原因:給了100%寬度,但是你在某個地方又給了margin-left或margin-right導致超出了原有的100%寬度,解決方法:給div乙個box-sizing:border-box;即可!

在用HTML css寫頁面中遇到的問題

一 清除浮動。1 verflow hidden 這個css樣式是大家常用到的css樣式,但是大多數人對這個樣式的理解僅僅侷限於隱藏溢位,而對於清除浮動這個含義不是很 了解。一提到清除浮動,我們就會想到另外乙個css樣式 clear both,我相信對於這個屬性的理解大家都不成問題的。verflow ...

LayUI寫登入註冊頁面遇到的問題

使用layui框架寫登入和註冊介面時,遇到的一些小問題 輸入框 預設有margin left 110px 我想寫 使用者名稱 輸入框 的時候顯示就會右對齊。沒有什麼好的解決方法。只能手動調css,最後懶得調了。和layuiadmin的布局一樣在輸入框放了個圖示上去。一開始不知道這麼把登入框寫到居中的...

寫前端樣式遇到的一些問題

同樣的 會出現很多 超連結,但是超連結之間有分割線 就是 如導航欄 上各個欄目之間的小豎線。可以通過 下乙個兄弟選擇器來選擇 除第乙個以外的所有兄弟,再border left設定即可。乙個div裡面放乙個img,如果div的高度不夠高,設定了img的寬和高之後,div可能包裹不住img,因為img是...