【代碼筆記】Web-CSS-CSS Margin(外邊距)

mayaohua 發(fā)布于2019-04-23 11:51 / 3066人閱讀

一，效果圖。

二，代碼。

DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>CSS Margintitle>
    <style>
    p{
        background-color: yellow;
    }
    p.margin{
margin: 100px 50px;
    }
    style>
head>

<body>
   <p>This is a paragraph with no specified marginp>
   <p class="margin">this is a paragrapth with specified margins.p>
body>

html>

參考資料：《菜鳥教程》

GPU云服務(wù)器云服務(wù)器外邊距重疊 html外邊距上下 html外邊距顏色 html 邊框外邊距

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/1256.html

相關(guān)文章

css 的margin學(xué)習(xí)筆記

摘要：的特性始終是透明的。例如就等于如果只有兩個(gè)值，第一個(gè)值表示上下值，第二個(gè)值為左右的值。垂直外邊距合并問(wèn)題外邊距合并指的是，當(dāng)兩個(gè)垂直外邊距相遇時(shí)，它們將形成一個(gè)外邊距。合并后的外邊距的高度等于兩個(gè)發(fā)生合并的外邊距的高度中的較大者。 Margin的特性 margin始終是透明的。 margin通過(guò)使用單獨(dú)的屬性，可以對(duì)上、右、下、左的外邊距進(jìn)行設(shè)置。即：margin-top、marg...

leiyi 2019-08-28 18:00 評(píng)論0 收藏0
CSS學(xué)習(xí)筆記(六) 元素定位

摘要：方法一為父元素添加方法二同時(shí)浮動(dòng)元素方法三添加非浮動(dòng)的清除元素定位布局的核心是屬性，對(duì)元素盒子應(yīng)用這個(gè)屬性，可以相對(duì)于它在常規(guī)文檔流中的位置重新定位。絕對(duì)定位絕對(duì)定位會(huì)把元素徹底從文檔流中拿出來(lái)，然后相對(duì)于其他元素默認(rèn)是定位上下文定位。 1.盒模型盒模型，就是瀏覽器為頁(yè)面中的每個(gè) HTML 元素生成的矩形盒子。這些盒子們都要按照可見(jiàn)版式模型（visual formattin...

浠ラ箍 2019-08-28 18:03 評(píng)論0 收藏0
HTML、CSS筆記

摘要：相鄰的兄弟元素相鄰的兩個(gè)兄弟元素之間的外邊距會(huì)塌陷。塊級(jí)父元素與其第一個(gè)最后一個(gè)子元素如果塊級(jí)父元素中，上邊框?qū)挾燃吧蟽?nèi)邊距距離為時(shí)，此時(shí)這個(gè)塊級(jí)父元素和其第一個(gè)子元素就會(huì)發(fā)生上外邊距合并現(xiàn)象。盒模型在CSS中，使用標(biāo)準(zhǔn)盒模型描述這些矩形盒子中的每一個(gè)。這個(gè)模型描述了元素所占空間的內(nèi)容。每個(gè)盒子有四個(gè)邊：外邊距邊, 邊框邊, 內(nèi)填充邊與內(nèi)容邊。在標(biāo)準(zhǔn)模式下，一個(gè)塊的總寬度=...

frank_fun 2019-08-01 18:29 評(píng)論0 收藏0
HTML、CSS筆記

摘要：相鄰的兄弟元素相鄰的兩個(gè)兄弟元素之間的外邊距會(huì)塌陷。塊級(jí)父元素與其第一個(gè)最后一個(gè)子元素如果塊級(jí)父元素中，上邊框?qū)挾燃吧蟽?nèi)邊距距離為時(shí)，此時(shí)這個(gè)塊級(jí)父元素和其第一個(gè)子元素就會(huì)發(fā)生上外邊距合并現(xiàn)象。盒模型在CSS中，使用標(biāo)準(zhǔn)盒模型描述這些矩形盒子中的每一個(gè)。這個(gè)模型描述了元素所占空間的內(nèi)容。每個(gè)盒子有四個(gè)邊：外邊距邊, 邊框邊, 內(nèi)填充邊與內(nèi)容邊。在標(biāo)準(zhǔn)模式下，一個(gè)塊的總寬度=...

Aomine 2019-08-29 14:22 評(píng)論0 收藏0
前端菜鳥筆記 Day-4 CSS布局

摘要：元素框從文檔流完全刪除，并相對(duì)于其包含塊定位。簡(jiǎn)單來(lái)說(shuō)就是，元素不再占用任何文檔流的空間，只剩下相對(duì)于包含塊的定位顯示。行框和清理浮動(dòng)框旁邊的行框會(huì)被縮短，使行框圍繞浮動(dòng)框，所以創(chuàng)建浮動(dòng)框可以使文本圍繞圖像。文章大綱來(lái)源：【Day 3】HTML復(fù)習(xí) + CSS基礎(chǔ) CSS框模型寬度和高度內(nèi)邊距外邊距 CSS定位浮動(dòng) CSS框模型內(nèi)容引用：CSS 框模型概述 CSS 框模...

go4it 2019-08-30 15:55 評(píng)論0 收藏0