網站前端制作之css清除浮動和calc()函數

2023-02-20    分類: 網站建設

在網站的開發中,經常遇到的前端頁面的css樣式問題的一些記錄。 當子元素設置浮動的時候,父元素不設置高度的話,就會撐不開,那么父元素則需要清除浮動的;第一種方法是父元素設置overflow: hidden; 內容增加得多的時候,容易令內容被影藏,不能顯示溢出元素,例如子元素有設置box-shadow ,有一側的陰影則會被影藏掉了。
第二種方法,用clear:both;需要在最后一個浮動的子元素后面添加一個新的標簽,設置它為clear:both;即需要添加沒有意義的標簽。

網站前端代碼1

第三種方法如下圖, 利用設置偽元素after來實現浮動的清除。設置*zoom: 1;是在ie6清除的;這種方法是相對其他更好的。
2.–calc,有時候網站內容有需要做幾個寬高相同的自適應內容盒子,例如三個,每個均等分,寬度33.33%的時候,還有0.01%間隙,這時可以用–calc,例如下圖:就能把100%均等分成三份。

網站前端代碼2

在使用–calc需要注意在運算符的前面和后面都需要添加一個空格,如上圖。除了上圖的“/”、“-”, 還能用“+”的和“*”的,而且可以用圖上的百分比和像素作為單位,此外還能用em和rem。

標題名稱:網站前端制作之css清除浮動和calc()函數
本文地址:http://m.kartarina.com/news0/238450.html

成都網站建設公司_創新互聯,為您提供微信公眾號電子商務網站策劃外貿網站建設定制網站域名注冊

廣告

聲明:本網站發布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創新互聯

外貿網站建設
主站蜘蛛池模板: 无码精品国产一区二区三区免费| 亚洲中文字幕无码中文字在线| 在线观看免费无码视频| 中文字幕人妻无码一夲道| 免费无码一区二区三区蜜桃| 国产午夜鲁丝无码拍拍| 人妻精品久久无码专区精东影业| 丰满亚洲大尺度无码无码专线| av无码a在线观看| 亚洲精品无码AV人在线播放| 亚洲av午夜精品无码专区| 在线A级毛片无码免费真人| 中文字幕久无码免费久久| 免费无码作爱视频| 亚洲国产精品无码久久久| 无码国产激情在线观看| 中日精品无码一本二本三本| 欧洲Av无码放荡人妇网站| 精品一区二区三区无码视频| 91精品国产综合久久四虎久久无码一级| 91精品无码久久久久久五月天 | 无码人妻精一区二区三区| 久久无码专区国产精品s| 亚洲综合最新无码专区| 久久精品aⅴ无码中文字字幕重口| 亚洲AV无码一区二三区| 无码av最新无码av专区| 国模无码一区二区三区不卡| 精品无码久久久久久久久久| 久久久国产精品无码一区二区三区| 亚洲av无码国产精品夜色午夜| 黑人巨大无码中文字幕无码| 2021无码最新国产在线观看| 亚洲av无码一区二区三区天堂古代| 亚洲AV无码成人网站久久精品大 | 无码A级毛片日韩精品| 亚洲AV无码资源在线观看| 久久久久精品国产亚洲AV无码| 久久久久亚洲av无码尤物| 黄桃AV无码免费一区二区三区| 永久免费无码日韩视频|