一,效果图。
二,代码。
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>
参考资料:《菜鸟教程》
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/1256.html
摘要:的特性始终是透明的。例如就等于如果只有两个值,第一个值表示上下值,第二个值为左右的值。垂直外边距合并问题外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。 Margin的特性 margin始终是透明的。 margin通过使用单独的属性,可以对上、右、下、左的外边距进行设置。即:margin-top、marg...
摘要:方法一为父元素添加方法二同时浮动元素方法三添加非浮动的清除元素定位布局的核心是属性,对元素盒子应用这个属性,可以相对于它在常规文档流中的位置重新定位。绝对定位绝对定位会把元素彻底从文档流中拿出来,然后相对于其他元素默认是定位上下文定位。 1.盒模型 盒模型,就是 浏览器为页面中的每个 HTML 元素生成的矩形盒子。 这些盒子们都要按照 可见版式模型(visual formattin...
摘要:相邻的兄弟元素相邻的两个兄弟元素之间的外边距会塌陷。块级父元素与其第一个最后一个子元素如果块级父元素中,上边框宽度及上内边距距离为时,此时这个块级父元素和其第一个子元素就会发生上外边距合并现象。 盒模型 在CSS中,使用标准盒模型描述这些矩形盒子中的每一个。这个模型描述了元素所占空间的内容。每个盒子有四个边:外边距边, 边框边, 内填充边 与 内容边。 在标准模式下,一个块的总宽度=...
摘要:相邻的兄弟元素相邻的两个兄弟元素之间的外边距会塌陷。块级父元素与其第一个最后一个子元素如果块级父元素中,上边框宽度及上内边距距离为时,此时这个块级父元素和其第一个子元素就会发生上外边距合并现象。 盒模型 在CSS中,使用标准盒模型描述这些矩形盒子中的每一个。这个模型描述了元素所占空间的内容。每个盒子有四个边:外边距边, 边框边, 内填充边 与 内容边。 在标准模式下,一个块的总宽度=...
摘要:元素框从文档流完全删除,并相对于其包含块定位。简单来说就是,元素不再占用任何文档流的空间,只剩下相对于包含块的定位显示。行框和清理浮动框旁边的行框会被缩短,使行框围绕浮动框,所以创建浮动框可以使文本围绕图像。 文章大纲来源:【Day 3】HTML复习 + CSS基础 CSS框模型 宽度和高度 内边距 外边距 CSS定位 浮动 CSS框模型 内容引用:CSS 框模型概述 CSS 框模...
阅读 2552·2021-10-25 09:45
阅读 1218·2021-10-14 09:43
阅读 2274·2021-09-22 15:23
阅读 1499·2021-09-22 14:58
阅读 1917·2019-08-30 15:54
阅读 3522·2019-08-30 13:00
阅读 1322·2019-08-29 18:44
阅读 1550·2019-08-29 16:59