您好,登錄后才能下訂單哦!
本篇內容主要講解“css中margin:auto指的是什么”,感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷,實用性強。下面就讓小編來帶大家學習“css中margin:auto指的是什么”吧!
首先auto是做什么的?
定義auto元素,因元素類型和上下文而異。在邊距中,auto可以表示兩種情況:占用可用空間或0px。這兩個將為元素定義不同的布局。
“自動”占用可用空間
這是我們利用auto最常見的用法。通過分配auto元素的左右邊距,它們可以平等地占據元素容器中的可用水平空間-因此元素將居中。
<divid="outer">
<divid="inner"></div>
</div>
#inner{
margin:auto;
width:250px;
height:125px;
background-image:linear-gradient(45deg,#84ECEF10%,#F8F62F60%,#FDC018);
}
#outer{
height:500px;
width:500px;
background:#1F1D20;
background-image:linear-gradient(#7575751px,transparent1px),linear-gradient(90deg,#7575751px,transparent1px);
background-size:25px25px;
}
但是,這只適用于水平邊距,它不適用于浮動和內聯元素,并且它本身也不能用于絕對和固定定位元素。
推薦手冊:CSS在線手冊
由于auto左右邊距均勻地占據“可用”空間,當你auto只給出其中一個時,你認為會發生什么?
左邊距或右邊距auto將占據所有“可用”空間,使元素看起來像是向右或向左偏移。
<divid="outer">
<divid="inner"></div>
</div>
#inner{
margin-right:auto;
width:250px;
height:125px;
background-image:linear-gradient(45deg,#84ECEF10%,#F8F62F60%,#FDC018);
}
#outer{
height:500px;
width:500px;
background:#1F1D20;
background-image:linear-gradient(#7575751px,transparent1px),linear-gradient(90deg,#7575751px,transparent1px);
background-size:25px25px;
}
到此,相信大家對“css中margin:auto指的是什么”有了更深的了解,不妨來實際操作一番吧!這里是億速云網站,更多相關內容可以進入相關頻道進行查詢,關注我們,繼續學習!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。