前端外邊距（margin）的問題

原創 开发维护 2020-06-16 14:32

1.上下外邊距會疊壓

2.父子級包含的時候，子級的margin-top會傳遞給父級。

3.設置  margin-left:auto 時，此時 元素會緊緊的靠在 右側

4.設置  margin-right:auto 時，此時 元素會緊緊的靠在 左側

5.綜合3.4兩點  當同時設置   margin-left:auto； margin-right:auto 時，元素會緊緊的位於父類元素的正中間 


總結：

     外邊距存在很多問題，建議用內邊距（padding）替代外邊距

發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章

Element-ui

Element-ui一、什麼是Element-ui 一、什麼是Element-ui element 是基於 vue 實現的一套不依賴業務的 UI 組件庫，提供了豐富的PC端組件，減少用戶對常用組件的封裝，降低了開發的難易程度

狂风 2020-07-08 11:49:25

動態添加tab選項卡及tab頁面內容（ajax請求json數據）

作者：mandy 1.實現效果 2.html部分： <div id="ifrContentId"></div> 3.js部分 $(document).ready(function () {

Insightzen_xian 2020-07-07 22:21:01

element-ui組件擴展--自定義分頁組件

作者:mandy element-ui組件擴展–自定義分頁組件 *想要封裝好一個組件，必須要熟練掌握這三個知識點： 1.父組件傳值到子組件（props） 2.子組件傳值到父組件（emit）3.插槽使用（slot）。對於一個獨立的組

Insightzen_xian 2020-07-07 22:21:01

15個jQuery代碼片段

摘要：開發人員利用jQuery代碼不僅能給網站帶來各種動畫、特效，還會提高網站的用戶體驗。本文總結了開發者經常使用的15個jQuery代碼片段，大家可以直接拿來用。 jQuery裏提供了許多創建交互式網站的方法，在開發Web項

风继续吹DV 2020-07-07 21:19:19

前端技術（素材）

前端技術         前端開發是創建Web頁面或app等前端界面呈現給用戶的過程，通過HTML，CSS及JavaScript以及衍生出來的各種技術、框架、解決方案，來實現互聯網產品的用戶界面交互。 以下是有關前端技術的參考資料

繁华落幕@Dummer 2020-07-07 14:51:56

VUE問題：You are using the runtime-only build of Vue where the template compiler is not available.

轉載至 https://segmentfault.com/a/1190000006435886 Troubleshooting of upgrading Vue from 1.0 to 2.0 系列文章: Vue 2.0 升（cai）

待鸣 2020-07-07 03:58:56

html 導出 word 調整頁邊距

經分析源碼，添加如下CSS代碼即可： @page WordSection1 {size:595.3pt 841.9pt; margin:30.0pt 30.0pt 30.0pt 30.0pt; mso-header-margin:

待鸣 2020-07-07 03:58:44

[功能實現思路]html 郵件報 在 outlook 中錨點失效

功能需求： 有客戶提出我們發出的郵件報在 outlook裏錨點失效 解決方案： //html標籤 <html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-mi

待鸣 2020-07-07 03:58:44

如何使用uni-app快速成型一個微信小程序（一）

前言 在很多年前，微信小程序還在內測的時候，就嘗試寫過幾個小程序，但是那個時候也是因爲剛開始做開發，後端語言還沒整明白，並且感覺小程序應該不會火，加上小程序是用它自己的一套語法，所以對我個人而言學習成本較高，遂沒有繼續研究下去。

待鸣 2020-07-07 03:58:44

如何使用uni-app快速成型一個微信小程序（二）

正式編碼 我們在第一篇文章中已經實現了編碼環境的搭建，本章將從實際代碼中出發，構造一個查詢的小程序 產品目標 我們做一個產品之前，我們要明晰產品的功能和定位，現在要做的產品是一個國家獸藥限量數據查詢，定位於快速開箱即用，所以我們要

待鸣 2020-07-07 03:58:44

升級npm和node

轉載：npm升級 node升級 鏈接：https://blog.csdn.net/qq_16339527/article/details/73008708 轉載：Node.js npm被牆、下載慢的問題 淘寶npm源 鏈接：ht

Wayss_S 2020-07-06 14:38:27

jquery中class選擇器的用法

jquery選擇器中兩個class的用法 $(".class1 .class2") 選擇class1元素下class2的元素（中間有空格） $(".class1.class2") 選擇同時含有class1和class2的元素（中間沒有空格

2020037303 2020-07-06 06:44:22

關於Jquery2

Jquery 事件綁定 文檔加載之後執行 Js window.onload = function(){ 頁面加載之後執行的內容 } Jquery $(document).ready(function(){ 頁面加載

JiangLi_ 2020-07-04 10:05:13

關於Ajax異步請求

AJAX AJAX引言 ​ a)概念: ansychronous(異步) javascript(js) and xml(全稱,異步javaScript and XML) ​ b)傳統請求 ​ i

JiangLi_ 2020-07-04 10:05:03

關於Jquery1

Jquery1 回顧 js_day2 阻止默認提交行爲 表單 οnsubmit=“return false” 超鏈 javascript:void(0) 事件對象event 獲取事件源target 橫縱座標client

JiangLi_ 2020-07-04 10:05:03