HTML常用細節問題處理

2021-10-12 07:33:31 字數 1459 閱讀 3516

一.解決底部3個畫素問題

原因:底部多餘的為3畫素。是由元素預設為inline-block引起的。

方法: 1,給img標籤新增屬性vertical-align:top;(不是baseline即可)

2,img的父標籤新增屬性:font-size:0;

3,給新增屬性:display:block;

二.超出文字隱藏,並用省略號代替

方法: overflow:hidden;//超出隱藏

text-overflow:ellipsis;//超出部分用…代替

white-space:nowrap;//溢位不換行

三.盒子塌陷

原因:巢狀關係的兩個盒子,垂直方向上,子元素設定了margin-top,父元素就會塌陷

方法:1.給父盒子新增overflow屬性。

overflow:auto; 有可能出現滾動條,影響美觀。

overflow:hidden; 可能會帶來內容不可見的問題。

2.給父盒子上邊框

3.給父盒子上內邊距

4.給父盒子新增浮動

5.給父盒子絕對定位或者固定定位

四.子元素都浮動,父元素沒有高度了

原因:子元素使用float後,脫離了正常文件流,使父元素沒有高度

方法:1.為父元素設定高度:適用於知道父級高度的情況,缺點是父級元素不能自適應

2.使用clear:both清除浮動:在父元素結束標籤之前新增乙個清除浮動元素(例如

),缺點是引入了沒有語義的元素

3.在父元素加overflow:hiddle;這個方法可以使父級自適應

4.在父元素上加偽類::after,在父元素內部插入元素塊,達到清除浮動的效果,實現原理類似於clear:both方法。(推薦)

單偽元素清除

.box::after

.box

雙偽元素清除

.box::before , .box::after

.box::after

.box

五.定位元素水平居中

1.left:0;

2.right:0;

3.margin:auto;

六.突出顯示

transform:translatez(-10px);

box-shadow:0 0 10px #999;

七.行內塊元素之間空格如何解決

1.父元素letter-spacing : 負值;

子元素letter-spacing : 0;

2.父元素word-spacing : 負值;

子元素word-spacing : 0;

3.父元素font-size: 0px;

子元素單獨設定字型大小;

openpose的細節處理

最近使用openpose,但是有一些細節 中沒有給出,還有一些不太重要但也挺關鍵的細節需要搞清楚,這篇文章就把用到的這些細節一併及下來。1 vgg基礎網路的輸入輸出 中說vgg基礎網路用到了前10層,但是看原始碼的話,他是用了12層的。相關的輸入輸出維度如下 vgg cfg 64,64,m 128,...

ListView記憶體處理細節

listview注意事項 解決步驟 1 定義乙個空的listview資料集合,先在主線程中載入 第四步做完之後 利用定義的handler來傳送訊息更新ui message.obtain handler,message update listview sendtotarget 3 寫乙個類實現 han...

Arcgis處理細節記錄

startediting starteditoperation stopeditoperation stopediting true arcgis提供了編輯事務,支援資料回滾。但這種方式在使用icursor方法去更新資料時會導致記憶體溢位,大量資料在icursor的遍歷過程中並不會釋放,直到stop...