資訊專欄INFORMATION COLUMN
摘要：本文內(nèi)容表格邊框合并兄弟標(biāo)簽外邊距合并父子標(biāo)簽的外邊距合并首發(fā)日期表格邊框合并發(fā)生情況當(dāng)設(shè)置了后，表格的相鄰邊框會合并，使得邊框變粗了。
?
首發(fā)日期：2018-05-01
?
?
當(dāng)設(shè)置了cellpadding="0" cellspacing="0"后，表格的相鄰邊框會合并，使得邊框變粗了。
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Documenttitle>
<style>
table{
border:1px solid red;
}
td{
border:1px solid red;
}
style>
head>
<body>
<table cellpadding="0" cellspacing="0">
<tr>
<td>1td>
<td>2td>
<td>3td>
tr>
<tr>
<td>4td>
<td>5td>
<td>6td>
tr>
table>
body>
html>
?
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Documenttitle>
<style>
table{
border:1px solid red;
border-collapse:collapse;
}
td{
border:1px solid red;
}
style>
head>
<body>
<table cellpadding="0" cellspacing="0">
<tr>
<td>1td>
<td>2td>
<td>3td>
tr>
<tr>
<td>4td>
<td>5td>
<td>6td>
tr>
table>
body>
html>
?
?
當(dāng)上下兩個相鄰的標(biāo)簽都設(shè)置了外邊距時，那么他們之間的間距不是外邊距之和，而是其中最大的外邊距。
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Documenttitle>
<style>
div:first-child{
margin-bottom:15px;
background-color: orange;
}
div:last-child{
margin-top:35px;
background-color: blue;
}
style>
head>
<body>
<div>123div>
<div>123div>
body>
html>
想使子標(biāo)簽對父標(biāo)簽有一個外邊距，但發(fā)生了外邊距合并，子標(biāo)簽的外邊距沒有作用到父標(biāo)簽，反而合并到父標(biāo)簽對于其他標(biāo)簽的外邊距中（誰大采用誰）。
如果父標(biāo)簽沒有設(shè)置上內(nèi)邊距以及邊框，則父標(biāo)簽和子標(biāo)簽的上外邊距會合并，合并之后的外邊距為兩者之和。
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Documenttitle>
<style>
#father{
margin-top:100px;
background-color: blue;
}
#son{
margin-top:200px; /* 最終外邊距為200px */
background-color: green;
}
style>
head>
<body>
<div id="father">
<div id="son">123div>
div>
body>
html>
?
?
?
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Documenttitle>
<style>
#father{
margin-top:100px;
background-color: blue;
/* border:1px solid red; 方法一 */
/* padding-top:1px; 第二種方法*/
overflow:hidden; /* 方法三 */
}
#son{
margin-top:200px;
background-color: green; } style> head> <body> <div id="father"> <div id="son">123div> div> body> html>
?
?
?
?
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/2312.html
摘要：盒子模型我們把布局里面的所有東西都可以想象成一個盒子，盒子里面又裝著小盒子，小盒子里面又裝著小小盒子所以布局的萬物基于盒子。雖然外邊距是不可見的，但是我們算元素的總寬度或者總高度的時候，要加上外邊距。 盒子模型 我們把布局里面的所有東西都可以想象成一個盒子，盒子里面又裝著小盒子，小盒子里面又裝著小小盒子......所以布局的萬物基于盒子。即使一個小小的元素p，也可以把它抽象成為一個盒子...
摘要：盒子模型我們把布局里面的所有東西都可以想象成一個盒子，盒子里面又裝著小盒子，小盒子里面又裝著小小盒子所以布局的萬物基于盒子。雖然外邊距是不可見的，但是我們算元素的總寬度或者總高度的時候，要加上外邊距。 盒子模型 我們把布局里面的所有東西都可以想象成一個盒子，盒子里面又裝著小盒子，小盒子里面又裝著小小盒子......所以布局的萬物基于盒子。即使一個小小的元素p，也可以把它抽象成為一個盒子...
摘要：合并問題塊級元素的上邊距和下邊距有時會合并或者折疊為一個外邊距捕獲到的重要信息只發(fā)生在塊級元素，但不包括浮動元素和絕對定位元素只發(fā)生在和當(dāng)前文檔流方向的相垂直的方向上由于默認(rèn)文檔流是水平流，因此發(fā)生合并的就是垂直方向會出現(xiàn)外邊距合并的三種基 1、margin合并問題 塊級元素的上邊距和下邊距有時會合并或者折疊為一個外邊距 捕獲到的重要信息 只發(fā)生在塊級元素，但不包括浮動元素和絕對定位...
摘要：相鄰的兄弟元素相鄰的兩個兄弟元素之間的外邊距會塌陷。塊級父元素與其第一個最后一個子元素如果塊級父元素中，上邊框?qū)挾燃吧蟽?nèi)邊距距離為時，此時這個塊級父元素和其第一個子元素就會發(fā)生上外邊距合并現(xiàn)象。 盒模型 在CSS中，使用標(biāo)準(zhǔn)盒模型描述這些矩形盒子中的每一個。這個模型描述了元素所占空間的內(nèi)容。每個盒子有四個邊：外邊距邊, 邊框邊, 內(nèi)填充邊 與 內(nèi)容邊。 在標(biāo)準(zhǔn)模式下，一個塊的總寬度=...
摘要：相鄰的兄弟元素相鄰的兩個兄弟元素之間的外邊距會塌陷。塊級父元素與其第一個最后一個子元素如果塊級父元素中，上邊框?qū)挾燃吧蟽?nèi)邊距距離為時，此時這個塊級父元素和其第一個子元素就會發(fā)生上外邊距合并現(xiàn)象。 盒模型 在CSS中，使用標(biāo)準(zhǔn)盒模型描述這些矩形盒子中的每一個。這個模型描述了元素所占空間的內(nèi)容。每個盒子有四個邊：外邊距邊, 邊框邊, 內(nèi)填充邊 與 內(nèi)容邊。 在標(biāo)準(zhǔn)模式下，一個塊的總寬度=...
閱讀 3479·2021-11-12 10:36
閱讀 2827·2021-11-11 16:55
閱讀 3053·2021-09-27 13:36
閱讀 1678·2021-08-05 10:01
閱讀 3633·2019-08-30 15:55
閱讀 842·2019-08-30 13:01
閱讀 1965·2019-08-29 17:16
閱讀 2427·2019-08-29 16:40
