国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

CSS規(guī)范 > 8 盒模型 Box Model

suemi / 2988人閱讀

摘要：當(dāng)兩個及以上外邊距折疊，合并后的外邊距寬度是發(fā)生折疊的外邊距中的最大寬度。如果該元素的外邊距同其父元素的上外邊距折疊，則該盒的上邊框邊緣同其父元盒的上邊框邊緣相同。

2017-07-20: 關(guān)于外邊距折疊, 推薦問題: https://segmentfault.com/q/10...

8 盒模型 Box Model 
URL: http://www.w3.org/TR/CSS2/box...


Translator : HaoyCn


Date: 15th of Aug, 2015

譯者注：本譯文僅擇精要部分翻譯了規(guī)范，主要描述了盒模型結(jié)構(gòu)，以及重點分析外邊距折疊。個人水平有限，歡迎指正！

CSS盒模型所描述的矩形盒由文檔樹內(nèi)的元素生成，根據(jù)視覺格式化模型布局。

8.1 盒尺寸 Box Dimensions

每個盒都有一個內(nèi)容區(qū)域 Content （如，文本，圖片等）以及可選的圍繞在周圍的內(nèi)邊距、邊框和外邊距區(qū)域；每個區(qū)域的大小由本文后述的屬性指定。下圖展示了這些區(qū)域的關(guān)聯(lián)以及用于描述外邊距、邊框和內(nèi)邊距的各部分的術(shù)語。

外邊距、邊框和內(nèi)邊距可以被分解到上、右、下、左各部分（如，在上圖中， LM 表示左外邊距， RP 表示右內(nèi)邊距， TB 表示上邊框等）。

四種區(qū)域（內(nèi)容、內(nèi)邊距、邊框、外邊距）的邊界被稱作一個“邊緣 Edge ”，因此每個盒有四種邊緣：

內(nèi)容邊緣 Content Edge 或內(nèi)邊緣 Inner Edge

內(nèi)容邊緣圍繞著由盒的寬和高所指定的矩形，該矩形通常由元素的已渲染內(nèi)容 Rendered Content 所決定。四個內(nèi)容邊緣規(guī)定了盒的內(nèi)容盒 Content Box 。

內(nèi)邊距邊緣

內(nèi)邊距邊緣圍繞著盒的內(nèi)邊距。如果內(nèi)邊距寬度為0，則內(nèi)邊距邊緣即是內(nèi)容邊緣。四個內(nèi)邊距邊緣規(guī)定了盒的內(nèi)邊距盒 Padding Box 。

邊框邊緣

邊框邊緣圍繞著盒的邊框。如果邊框?qū)挾葹?，則邊框邊緣即是內(nèi)邊距邊緣。四個邊框邊緣規(guī)定了盒的邊框盒 Border Box 。

外邊距邊緣或外邊緣

外邊距邊緣圍繞著盒的外邊距。如果外邊距寬度為0，則外邊距邊緣即邊框邊緣。四個外邊距邊緣規(guī)定了盒的外邊距盒 Margin Box 。

每個邊緣都可以被分解成上、右、下、左邊緣。

盒內(nèi)容區(qū)域的尺寸——即內(nèi)容寬度 Content Width 和內(nèi)容高度 Content Width ——由這些因素所決定：生成盒的元素是否設(shè)置了 width 和 height 屬性；盒是否包含了文本或其他盒；盒是否為表格；等等。盒的寬度和高度將在視覺格式化模型詳述一章中討論。

盒的內(nèi)容、內(nèi)邊距以及邊框區(qū)域的背景樣式由生成盒的元素的 background 屬性所規(guī)定。外邊距的背景始終為透明。

8.2 外邊距、內(nèi)邊距和邊框的例子

下例展示了外邊距、內(nèi)邊距和邊框如何交互。HTML文檔：




Examples of margins, padding, and borders<title>
<style type="text/css">
   ul { 
      background: yellow; 
      margin: 12px 12px 12px 12px;
      padding: 3px 3px 3px 3px;
      /* 未設(shè)置邊框 */
   }
   li { 
      color: white;/* 文本顏色為白色 */ 
      background: blue;/* 內(nèi)容和內(nèi)邊距背景為藍(lán)色 */
      margin: 12px 12px 12px 12px;
      padding: 12px 0px 12px 12px; /* 注意右內(nèi)邊距為0 */
      list-style: none/* 列表前沒有符號 */
      /* 未設(shè)置邊框 */
   }
   li.withborder {
      border-style: dashed;
      border-width: medium;/* 各邊均設(shè)置邊框 */
      border-color: lime;
   }
</style>
</head>
<body>
   <ul>
      <li>First element of list</li>
      <li id="hv9nztl"    class="withborder">Second element of list is a bit longer to illustrate wrapping.</li>
   </ul>
</body>
</html></pre>
<p>該文檔結(jié)果為文檔樹中（省略其他關(guān)系）一個 <b> ul </b> 元素及其兩個 <b> li </b> 子元素。</p>
<p>下面的第一圖展示了例子的結(jié)果。第二圖展示了 <b> ul </b> 元素及其 <b> li </b> 子元素的外邊距、內(nèi)邊距和邊框之間的關(guān)系。（圖片不成比例）</p>
<p><script type="text/javascript">showImg("https://segmentfault.com/img/bVnan5");</script></p>
<p>注意：</p>

<p><p>每個 <b> li </b> 盒的內(nèi)容寬度是從上到下計算的；所有 <b> li </b> 盒的包含塊由 <b> ul </b> 元素創(chuàng)建。</p></p>
<p><p>每個 <b> li </b> 盒的外邊距盒高度由其內(nèi)容高度加上上下內(nèi)邊距、邊框、外邊距所決定。需要留意的是 <b> li </b> 盒間的垂直外邊距發(fā)生了折疊。</p></p>
<p><p><b> li </b> 盒的右內(nèi)邊距寬度被設(shè)為零（ <b> padding </b> 屬性）。效果如第二圖所示。</p></p>
<p><p><b> li </b> 盒的外邊距是透明的——外邊距總為透明——所以 <b> ul </b> 的內(nèi)邊距和內(nèi)容區(qū)域的背景顏色（黃）穿透外邊距顯示了出來。</p></p>
<p><p>第二個 <b> li </b> 元素指定了虛線邊框（ <b> border-style </b> 屬性）。</p></p>

<b>8.3 外邊距各屬性</b>
<p>外邊距的各屬性規(guī)定了盒的外邊距區(qū)域的寬度。 <b> margin </b> 設(shè)置所有四個方向的外邊距，而其他外邊距屬性則只設(shè)置各自方向?qū)挾取＿@些屬性應(yīng)用于所有元素，但垂直外邊距在非替代行內(nèi)元素上無效。</p>
<pre><p>譯者注：此處以及下文的各屬性介紹均略，可查CSS手冊</p></pre>
<b>8.3.1 外邊距折疊</b>
<p>在CSS中，兩個及以上的（不一定是同胞）盒的相鄰?fù)膺吘嗫赡芎喜橐粋€多帶帶的外邊距。以這種方式的合并的外邊距被稱為折疊 <b> Collapse </b> ，合并后的外邊距被稱為折疊外邊距 <b> Collapsed Margin </b> 。</p>
<p>相鄰垂直外邊距發(fā)生折疊，除了：</p>

<p><p>根元素的盒的外邊距不折疊</p></p>
<p><p>如果一個有空隙的元素的上下外邊距相鄰，其外邊距將同其后同胞的相鄰?fù)膺吘嗾郫B，但不同父塊的下外邊距折疊。</p></p>

<p>水平外邊距不重疊。</p>
<p>兩個外邊距為相鄰關(guān)系，當(dāng)且僅當(dāng)：</p>

<p><p>是同屬一個塊格式化上下文的文檔流內(nèi)塊級盒</p></p>
<p><p>沒有行盒、空隙、內(nèi)邊距和邊框分隔它們（注意某些零高度行盒會因此而被忽略（見9.4.2章））</p></p>
<p><p>盒邊緣垂直相鄰，也就是說，滿足以下形式之一：</p></p>
<p><p>盒上外邊距及其第一個文檔流內(nèi)子盒的上外邊距</p></p>
<p><p>盒下外邊距及下一個文檔流內(nèi)的同胞盒的上外邊距</p></p>
<p><p>如果父盒的高度計算值為 <b> auto </b> ，其最后一個文檔流內(nèi)子盒的下外邊距及父盒的下外邊距</p></p>
<p><p>如果一個盒不建立新的塊格式化上下文、 <b> min-height </b> 計算值為零、 <b> height </b> 計算值為零或 <b> auto </b> 、沒有在文檔流內(nèi)的子盒，其上下外邊距</p></p>

<p>如果一個折疊外邊距與另一外邊距的任何一邊相鄰，則視二者相鄰。</p>
<p>注意：不是同胞或祖先關(guān)系的元素也可以產(chǎn)生相鄰?fù)膺吘唷?/p>
<p>注意：上述規(guī)則表明了：</p>

<p><p>浮動盒的外邊距不同其他任何盒折疊（甚至浮動及其文檔流內(nèi)的子元素也不折疊）</p></p>
<p><p>創(chuàng)建了新的塊格式化上下文的元素（如浮動、 <b> overflow </b> 不為 <b> visible </b> 的元素）的外邊距不同其在文檔流內(nèi)的子元素外邊距折疊</p></p>
<p><p>絕對定位盒的外邊距不同其他任何盒折疊（甚至不同其文檔流內(nèi)的子元素折疊）</p></p>
<p><p>行內(nèi)塊盒的外邊距不同其他任何盒折疊（甚至不同其文檔流內(nèi)的子元素折疊）</p></p>
<p><p>文檔流內(nèi)塊級元素的下外邊距始終同其下一個文檔流內(nèi)的塊級同胞的上外邊距折疊，除非該對同胞之間有空隙。</p></p>
<p><p>文檔流內(nèi)塊元素如果沒有上邊框和上內(nèi)邊距，其第一個文檔流內(nèi)塊級子元素沒有空隙，二者的上外邊距折疊。</p></p>
<p><p>文檔流內(nèi) <b> height </b> 為 <b> auto </b> 、 <b> min-height </b> 為零、沒有下內(nèi)邊距和下邊框的塊盒，如果其最后一個文檔流內(nèi)塊級子盒的下外邊距沒有同一個有空隙的上外邊距折疊，二者下外邊距折疊。</p></p>
<p><p>如果某盒的 <b> min-height </b> 屬性為零、沒有上下邊框和上下內(nèi)邊距、其 <b> height </b> 為0或 <b> auto </b> 、沒有包含行盒、其所有的文檔流內(nèi)子元素外邊距（如果有）折疊，則折疊其外邊距。</p></p>

<p>當(dāng)兩個及以上外邊距折疊，合并后的外邊距寬度是發(fā)生折疊的外邊距中的最大寬度。如果發(fā)生折疊的外邊距中有負(fù)數(shù)，則為最大正數(shù)相鄰?fù)膺吘鄿p去最小負(fù)數(shù)相鄰?fù)膺吘嗟慕^對值。如果不存在正數(shù)外邊距，則為零減去最小負(fù)數(shù)相鄰?fù)膺吘嗟慕^對值。</p>
<p>如果一個盒的上下外邊距相鄰，則外邊距可能穿過盒而折疊 <b> Collapse Through It </b> 。這種情況下，元素的定位取決于它同其他外邊距折疊的元素的關(guān)系。</p>

<p><p>如果該元素的外邊距同其父元素的上外邊距折疊，則該盒的上邊框邊緣同其父元盒的上邊框邊緣相同。</p></p>
<p><p>否則，要么該元素的父元素的外邊距不折疊，要么只有父元素的下外邊距折疊。上邊框邊緣位置是假定該元素下邊框非零時的位置。</p></p>

<p>需要注意的是，被折疊穿過的元素的定位對與之外邊距折疊的其他元素的定位無影響；其上邊框邊緣的定位僅用于布局其后代元素。</p>
<b>8.6 雙向上下文 Bidirectional Context 中行內(nèi)元素的盒模型</b>
<p>對每個行盒而言，用戶代理必須按視覺順序（而非邏輯順序）渲染其生成的行內(nèi)盒的外邊距、邊框和內(nèi)邊距。</p>
<p>當(dāng)元素 <b> direction </b> 屬性值為 <b> ltr </b> ，元素呈現(xiàn)的第一個行盒的最左生成盒擁有左外邊距、左邊框和左內(nèi)邊距，而元素呈現(xiàn)的最后一個行盒的最右生成盒擁有右內(nèi)邊距、右邊框和右外邊距。</p>
<p>當(dāng)元素 <b> direction </b> 屬性值為 <b> rtl </b> ，元素呈現(xiàn)的第一個行盒的最右生成盒擁有右外邊距、右邊框和右內(nèi)邊距，而元素呈現(xiàn)的最后一個行盒的最左生成盒擁有左內(nèi)邊距、左邊框和左外邊距。</p>
<b>譯者之思</b>
<p>譯者讀畢此文，細(xì)心揣摩，將經(jīng)驗和疑問總結(jié)如下：</p>
<b>一、兩種盒模型</b>
<p>本章節(jié)描述了W3C的標(biāo)準(zhǔn)盒模型，同時還存在IE6在怪異模式 <b> Quicks Mode </b> 的另一種盒模型。此處簡述二者的區(qū)別如下——</p>
<p>W3C標(biāo)準(zhǔn)下：盒總寬/高度 = width/height + padding + border + margin</p>
<p>怪異模式下：盒總寬/高度 = width/height + margin = 內(nèi)容寬/高度 + padding + border + margin</p>
<p>CSS3中， <b> box-sizing </b> 默認(rèn)為 <b> content-box </b> ，即采用W3C標(biāo)準(zhǔn)盒模型，若取值 <b> border-box </b> 則采用怪異模式盒模型。</p>
<b>二、不透明的外邊距</b>
<p>CSS規(guī)范道：</p>
<pre><p>盒的內(nèi)容、內(nèi)邊距以及邊框區(qū)域的背景樣式由生成盒的元素的 <b> background </b> 屬性所規(guī)定。外邊距的背景始終為透明。</p></pre>
<p>但在根元素 <b> html </b> 上設(shè)置了外邊距，并規(guī)定了背景，該背景仍鋪滿全屏。</p>
<p>如下CSS：</p>
<pre>html {
margin: 50px;
background: #000;
}</pre>
<p><b> body </b> 同此理。譯者暫不知其因。歡迎讀者指教。</p>
<b>三、有空隙的元素</b>
<p>外邊距折疊中，很多地方敘述了“有空隙的元素”，這是什么意思呢？其意義即是說，該元素清除了浮動。</p>
<p>在翻譯視覺格式化模型一章中，W3C給出了清除浮動以及計算空隙寬度的的案例，譯者建議讀者認(rèn)真閱讀該部分，尤其關(guān)注：當(dāng)空隙為負(fù)值時取消外邊距折疊的情形。</p>
<p>點此閱讀：http://segmentfault.com/a/119...。</p>
<p>如果讀者已經(jīng)掌握清除浮動和空隙的知識，那就讓我們來看一個有空隙的情景。</p>
<pre><p>如果一個有空隙的元素的上下外邊距相鄰，其外邊距將同其后同胞的相鄰?fù)膺吘嗾郫B，但不同父塊的下外邊距折疊。</p></pre>
<p>以下代碼中， <b> B </b> 是浮動塊，為清除其浮動， <b> C </b> 引入了空隙。</p>
<p>共同CSS：</p>
<pre>html,body{padding:0;margin:0;}
/*橫線，直觀對比折疊情況*/
.line{height:50px;background:red;} 
.mt{margin-top:50px;}
.mb{margin-bottom:50px;}
#B{float:left;width:1px;height:1px;}
#C{clear:both;}</pre>
<p><strong>其外邊距將同其后同胞的相鄰?fù)膺吘嗾郫B：</strong></p>
<p>HTML：</p>
<pre><body>
   <div   class="hb9x9j5"   id="A">
      <div   class="3vljrvr"   id="B"></div>
      <div   class="zjlnnnr"   id="C" class="mb"></div>
      <div   class="bt1znff"   id="D" class="mb"></div>
      <div   id="3v33xpz"   class="line"></div>
   </div>
 </body></pre>
<p>渲染結(jié)果是， <b> C </b> 和 <b> D </b> 的外邊距折疊。</p>
<p><strong>不同父塊的下外邊距折疊</strong></p>
<p>HTML：</p>
<pre> <body>
   <div   class="zxxvb1n"   id="A" class="mb">
      <div   class="9bjtdbf"   id="B"></div>
      <div   class="d1r9xpf"   id="C" class="mb"></div>
   </div>
   <div   id="zv9jh3f"   class="line"></div>
 </body></pre>
<p>渲染結(jié)果是， <b> C </b> 的外邊距不同其父元素 <b> A </b> 的外邊距折疊。</p>
<b>四、避免盒自身垂直外邊距折疊</b>
<pre><p>如果一個盒不建立新的塊格式化上下文、 <b> min-height </b> 計算值為零、 <b> height </b> 計算值為零或 <b> auto </b> 、沒有在文檔流內(nèi)的子盒，其上下外邊距</p></pre>
<p>由此可以得出幾種避免盒自身上下外邊距折疊的辦法，簡單列舉如下：</p>

<p><p>建立新塊格式化上下文，如 <b> overflow: hidden </b></p></p>
<p><p>設(shè)置 <b> min-height </b></p></p>
<p><p>設(shè)置固定高 <b> height </b></p></p>
<p><p>添加文檔流內(nèi)（即非浮動、非絕對定位）子盒</p></p>

<p>需要注意最后一種辦法，子盒要么有邊框或內(nèi)邊距，要么有內(nèi)容，否則父盒的自身垂直外邊距同樣會折疊。而如果子盒只有垂直外邊距，該垂直外邊距將同父盒的垂直外邊距折疊，而不會阻止父盒自身垂直邊距折疊。</p>           
               
                                           
                       
                 </div>
            
                     <div   id="xlbnrzd"   class="mt-64 tags-seach" >
                 <div   id="73bf5pv"   class="tags-info">
                                                                                                                    
                         <a style="width:120px;" title="云服務(wù)器" href="http://specialneedsforspecialkids.com/site/active/kuaijiesale.html?ytag=seo">云服務(wù)器</a>
                                             
                         <a style="width:120px;" title="GPU云服務(wù)器" href="http://specialneedsforspecialkids.com/site/product/gpu.html">GPU云服務(wù)器</a>
                                                                                                                                                 
                                      
                     
                    
                                                                                               <a style="width:120px;" title="模型Model" href="http://specialneedsforspecialkids.com/yun/tag/moxingModel/">模型Model</a>
                                                                                                           <a style="width:120px;" title="盒模型" href="http://specialneedsforspecialkids.com/yun/tag/hemoxing/">盒模型</a>
                                                                                                           <a style="width:120px;" title="盒模型html嗎" href="http://specialneedsforspecialkids.com/yun/tag/hemoxinghtmlma/">盒模型html嗎</a>
                                                                                                           <a style="width:120px;" title="簡述html盒模型" href="http://specialneedsforspecialkids.com/yun/tag/jianshuhtmlhemoxing/">簡述html盒模型</a>
                                                         
                 </div>
               
              </div>
             
               <div   id="vn3zxdn"   class="entry-copyright mb-30">
                   <p class="mb-15"> 文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。</p>
                 
                   <p>轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/111117.html</p>
               </div>
                      
               <ul class="pre-next-page">
                 
                                  <li id="7dxf1pl"    class="ellipsis"><a class="hpf" href="http://specialneedsforspecialkids.com/yun/111116.html">上一篇：用 CSS 實現(xiàn)三角形與平行四邊形</a></li>  
                                                
                                       <li id="r59xv9r"    class="ellipsis"><a class="hpf" href="http://specialneedsforspecialkids.com/yun/111118.html">下一篇：[譯]如何成為一個優(yōu)秀的前端工程師</a></li>
                                  </ul>
              </div>
              <div   id="dhl1pfl"   class="about_topicone-mid">
                <h3 class="top-com-title mb-0"><span data-id="0">相關(guān)文章</span></h3>
                <ul class="com_white-left-mid atricle-list-box">
                             
                                                                                                    <li>
                                                <div   id="3hjf9xh"   class="atricle-list-right">
                          <h2 class="ellipsis2"><a class="hpf" href="http://specialneedsforspecialkids.com/yun/111120.html"><b><em>CSS</em><em>規(guī)范</em> &<em>gt</em>; 9 視覺格式化<em>模型</em> Visual Formatting <em>Model</em></b></a></h2>
                                                     <p class="ellipsis2 good">摘要：盒的類型會影響其在視覺格式化模型中的表現(xiàn)。浮動元素絕對定位元素根元素都被稱為脫離文檔流其他元素被稱為文檔流內(nèi)。

視覺格式化模型 Visual Formatting Model

URL：http://www.w3.org/TR/CSS2/visuren.html
Translator: HaoyCn 
Date: 14th of Aug, 2015

本文并未全部翻譯，譯者在原文基礎(chǔ)上...</p>
                                                   
                          <div   id="zt9rnxp"   class="com_white-left-info">
                                <div   id="db3rltr"   class="com_white-left-infol">
                                    <a href="http://specialneedsforspecialkids.com/yun/u-10.html"><img src="http://specialneedsforspecialkids.com/yun/data/avatar/000/00/00/small_000000010.jpg" alt=""><span id="tdl1b3l"    class="layui-hide64">魏憲會</span></a>
                                    <time datetime="">2019-08-28 18:15</time>
                                    <span><i class="fa fa-commenting"></i>評論0</span> 
                                    <span><i class="fa fa-star"></i>收藏0</span> 
                                </div>
                          </div>
                      </div>
                    </li> 
                                                                                       <li>
                                                <div   id="phdxlzb"   class="atricle-list-right">
                          <h2 class="ellipsis2"><a class="hpf" href="http://specialneedsforspecialkids.com/yun/111155.html"><b><em>CSS</em><em>規(guī)范</em> &<em>gt</em>; 10 視覺格式化<em>模型</em>詳述 Visual Formatting <em>Model</em> De</b></a></h2>
                                                     <p class="ellipsis2 good">摘要：行盒的寬度由其包含塊給予，但可能因浮動而縮小。絕對定位不可替換元素的使用值約束為包含塊寬度如果和均為首先將以及值為的設(shè)為。

2015/10/08： 原10.8標(biāo)題 行盒高度計算改為10.8 行高計算。英文原文為line height。由于翻譯時候看到那段結(jié)論是行盒的高度，腦抽就把原本翻譯對的標(biāo)題改了下，剛回顧一番深覺不妥，故改回來。
原文：http://www.w3.org/TR/CS...</p>
                                                   
                          <div   id="z5h1bbd"   class="com_white-left-info">
                                <div   id="971jhfp"   class="com_white-left-infol">
                                    <a href="http://specialneedsforspecialkids.com/yun/u-1047.html"><img src="http://specialneedsforspecialkids.com/yun/data/avatar/000/00/10/small_000001047.jpg" alt=""><span id="nvt9jnz"    class="layui-hide64">frolc</span></a>
                                    <time datetime="">2019-08-28 18:18</time>
                                    <span><i class="fa fa-commenting"></i>評論0</span> 
                                    <span><i class="fa fa-star"></i>收藏0</span> 
                                </div>
                          </div>
                      </div>
                    </li> 
                                                                                       <li>
                                                <div   id="l1vjvj1"   class="atricle-list-right">
                          <h2 class="ellipsis2"><a class="hpf" href="http://specialneedsforspecialkids.com/yun/111152.html"><b><em>CSS</em> &<em>gt</em>; <em>CSS</em>3 中的層疊上下文初探</b></a></h2>
                                                     <p class="ellipsis2 good">摘要：但該盒不建立新的層疊上下文，除非是根元素。以上是基于的層疊上下文介紹。同級情況下，按照二者在源代碼中的順序，居后的又重新占領(lǐng)高地了。現(xiàn)在我們看以下源代碼這個時候，以視口為包含塊進(jìn)行定位和大小計算，將會鋪滿整個屏幕。

前言：關(guān)于層疊上下文，筆者還沒有去閱讀更詳細(xì)的 W3C 規(guī)范來了解更本質(zhì)的原理（表打我，等我校招拿到 offer 了我就讀好伐 T_T）。一直聽說 CSS3 里的層疊上下文...</p>
                                                   
                          <div   id="zzbhvh9"   class="com_white-left-info">
                                <div   id="t3thvvd"   class="com_white-left-infol">
                                    <a href="http://specialneedsforspecialkids.com/yun/u-394.html"><img src="http://specialneedsforspecialkids.com/yun/data/avatar/000/00/03/small_000000394.jpg" alt=""><span id="9tvdnx1"    class="layui-hide64">pcChao</span></a>
                                    <time datetime="">2019-08-28 18:18</time>
                                    <span><i class="fa fa-commenting"></i>評論0</span> 
                                    <span><i class="fa fa-star"></i>收藏0</span> 
                                </div>
                          </div>
                      </div>
                    </li> 
                                                                                       <li>
                                                <div   id="r1dhrnf"   class="atricle-list-right">
                          <h2 class="ellipsis2"><a class="hpf" href="http://specialneedsforspecialkids.com/yun/115708.html"><b><em>CSS</em>中各種布局的背后(*FC)</b></a></h2>
                                                     <p class="ellipsis2 good">摘要：中各種布局的背后，實質(zhì)上是各種的組合。相反，一些塊容器盒，比如非替換行內(nèi)塊及非替換表格單元格，不是塊級盒。描述元素跟它的后代之間的影響。行盒行盒由行內(nèi)格式化上下文產(chǎn)生的盒，用于表示一行。彈性容器外和彈性項目內(nèi)的一切元素都不受影響。

CSS中各種布局的背后，實質(zhì)上是各種*FC的組合。CSS2.1 中只有 BFC 和 IFC, CSS3 中還增加了 FFC 和 GFC。
盒模型(Box M...</p>
                                                   
                          <div   id="9779l7l"   class="com_white-left-info">
                                <div   id="hj3zp1d"   class="com_white-left-infol">
                                    <a href="http://specialneedsforspecialkids.com/yun/u-1220.html"><img src="http://specialneedsforspecialkids.com/yun/data/avatar/000/00/12/small_000001220.jpg" alt=""><span id="jlprzt1"    class="layui-hide64">miracledan</span></a>
                                    <time datetime="">2019-08-30 14:01</time>
                                    <span><i class="fa fa-commenting"></i>評論0</span> 
                                    <span><i class="fa fa-star"></i>收藏0</span> 
                                </div>
                          </div>
                      </div>
                    </li> 
                                                                                       <li>
                                                <div   id="xpzb9pj"   class="atricle-list-right">
                          <h2 class="ellipsis2"><a class="hpf" href="http://specialneedsforspecialkids.com/yun/116548.html"><b>視覺格式化<em>模型</em>(Visual formatting <em>model</em>)</b></a></h2>
                                                     <p class="ellipsis2 good">摘要：塊級盒參與塊格式化上下文。行內(nèi)級盒參與行內(nèi)格式化上下文塊格式化上下文行內(nèi)格式化上下文相對定位浮動盒就是一個在當(dāng)前行向左或向右移動的盒。浮動絕對定位絕對定位模型中，一個盒會有相對于其包含塊的明確偏移，它會從常規(guī)流中全部移除不會影響后面的兄弟。

在可視化格式模型(Visual formatting model)當(dāng)中,文檔樹中的每個元素根據(jù)其盒模型生成0個或多個盒.這些盒的布局由(以下因素)...</p>
                                                   
                          <div   id="5pdnttz"   class="com_white-left-info">
                                <div   id="vpp7djb"   class="com_white-left-infol">
                                    <a href="http://specialneedsforspecialkids.com/yun/u-1375.html"><img src="http://specialneedsforspecialkids.com/yun/data/avatar/000/00/13/small_000001375.jpg" alt=""><span id="hfdd11r"    class="layui-hide64">jokester</span></a>
                                    <time datetime="">2019-08-30 15:53</time>
                                    <span><i class="fa fa-commenting"></i>評論0</span> 
                                    <span><i class="fa fa-star"></i>收藏0</span> 
                                </div>
                          </div>
                      </div>
                    </li> 
                                                                           
                </ul>
              </div>
              
               <div   id="r1xv5jr"   class="topicone-box-wangeditor">
                  
                  <h3 class="top-com-title mb-64"><span>發(fā)表評論</span></h3>
                   <div   id="dll7vxx"   class="xcp-publish-main flex_box_zd">
                                      
                      <div   id="jdnlrbf"   class="unlogin-pinglun-box">
                        <a href="javascript:login()" class="grad">登陸后可評論</a>
                      </div>                   </div>
               </div>
              <div   id="frvhpf1"   class="site-box-content">
                <div   id="pfzhhbj"   class="site-content-title">
                  <h3 class="top-com-title mb-64"><span>0條評論</span></h3>   
                </div> 
                      <div   id="vj519nt"   class="pages"></ul></div>
              </div>
           </div>
           <div   id="9flhxff"   class="layui-col-md4 layui-col-lg3 com_white-right site-wrap-right">
              <div   id="1nnttjd"   class=""> 
                <div   id="rdl9bnb"   class="com_layuiright-box user-msgbox">
                    <a href="http://specialneedsforspecialkids.com/yun/u-567.html"><img src="http://specialneedsforspecialkids.com/yun/data/avatar/000/00/05/small_000000567.jpg" alt=""></a>
                    <h3><a href="http://specialneedsforspecialkids.com/yun/u-567.html" rel="nofollow">suemi</a></h3>
                    <h6>男<span>|</span>高級講師</h6>
                    <div   id="x1fvbtx"   class="flex_box_zd user-msgbox-atten">
                     
                                                                      <a href="javascript:attentto_user(567)" id="attenttouser_567" class="grad follow-btn notfollow attention">我要關(guān)注</a>
      
                                                                                        <a href="javascript:login()" title="發(fā)私信" >我要私信</a>
                     
                                            
                    </div>
                    <div   id="ttzp1nx"   class="user-msgbox-list flex_box_zd">
                          <h3 class="hpf">TA的文章</h3>
                          <a href="http://specialneedsforspecialkids.com/yun/ut-567.html" class="box_hxjz">閱讀更多</a>
                    </div>
                      <ul class="user-msgbox-ul">
                                                  <li><h3 class="ellipsis"><a href="http://specialneedsforspecialkids.com/yun/124947.html">奈學(xué)百萬云原生架構(gòu)師</a></h3>
                            <p>閱讀 2621<span>·</span>2021-11-25 09:43</p></li>
                                                       <li><h3 class="ellipsis"><a href="http://specialneedsforspecialkids.com/yun/122862.html">ZJI：雙十一，自營服務(wù)器/阿里云專線服務(wù)器全部55折優(yōu)惠，月付412元起，999元可獲得1100元</a></h3>
                            <p>閱讀 2724<span>·</span>2021-11-04 16:09</p></li>
                                                       <li><h3 class="ellipsis"><a href="http://specialneedsforspecialkids.com/yun/122338.html">2021年9月國產(chǎn)數(shù)據(jù)庫大事記</a></h3>
                            <p>閱讀 1634<span>·</span>2021-10-12 10:13</p></li>
                                                       <li><h3 class="ellipsis"><a href="http://specialneedsforspecialkids.com/yun/121556.html">前端技術(shù)棧月刊 ???? 2021-09</a></h3>
                            <p>閱讀 880<span>·</span>2021-09-29 09:35</p></li>
                                                       <li><h3 class="ellipsis"><a href="http://specialneedsforspecialkids.com/yun/117911.html">NextArray：美國達(dá)拉斯VPS/2核1G/20GB SSD或者100GB HDD/100Mbp</a></h3>
                            <p>閱讀 880<span>·</span>2021-08-03 14:03</p></li>
                                                       <li><h3 class="ellipsis"><a href="http://specialneedsforspecialkids.com/yun/117389.html">CSS實用技巧</a></h3>
                            <p>閱讀 1777<span>·</span>2019-08-30 15:55</p></li>
                                                       <li><h3 class="ellipsis"><a href="http://specialneedsforspecialkids.com/yun/111117.html">CSS規(guī)范 > 8 盒模型 Box Model</a></h3>
                            <p>閱讀 2989<span>·</span>2019-08-28 18:14</p></li>
                                                       <li><h3 class="ellipsis"><a href="http://specialneedsforspecialkids.com/yun/109395.html">前端培訓(xùn)-初級階段（13） - 正則表達(dá)式</a></h3>
                            <p>閱讀 3489<span>·</span>2019-08-26 13:43</p></li>
                                                
                      </ul>
                </div>

                   <!-- 文章詳情右側(cè)廣告-->
              
  <div   id="xvnxhnt"   class="com_layuiright-box">
                  <h6 class="top-com-title"><span>最新活動</span></h6> 
           
         <div   id="tnnr399"   class="com_adbox">
                    <div   id="hzrbdp9"   class="layui-carousel" id="right-item">
                      <div carousel-item>
                                                                                                                       <div>
                          <a href="http://specialneedsforspecialkids.com/site/active/kuaijiesale.html?ytag=seo"  rel="nofollow">
                            <img src="http://specialneedsforspecialkids.com/yun/data/attach/240625/2rTjEHmi.png" alt="云服務(wù)器">                                 
                          </a>
                        </div>
                                                <div>
                          <a href="http://specialneedsforspecialkids.com/site/product/gpu.html"  rel="nofollow">
                            <img src="http://specialneedsforspecialkids.com/yun/data/attach/240807/7NjZjdrd.png" alt="GPU云服務(wù)器">                                 
                          </a>
                        </div>
                                                                   
                    
                        
                      </div>
                    </div>
                      
                    </div>                    <!-- banner結(jié)束 -->
              
<div   id="v1rvzrd"   class="adhtml">

</div>
                <script>
                $(function(){
                    $.ajax({
                        type: "GET",
                                url:"http://specialneedsforspecialkids.com/yun/ad/getad/1.html",
                                cache: false,
                                success: function(text){
                                  $(".adhtml").html(text);
                                }
                        });
                    })
                </script>                </div>              </div>
           </div>
        </div>
      </div> 
    </section>
    <!-- wap拉出按鈕 -->
     <div   id="vjxbnnx"   class="site-tree-mobile layui-hide">
      <i class="layui-icon layui-icon-spread-left"></i>
    </div>
    <!-- wap遮罩層 -->
    <div   id="1z9vbzj"   class="site-mobile-shade"></div>
    
       <!--付費閱讀 -->
       <div   class="bdnvfr1"   id="payread">
         <div   id="1zd1dlj"   class="layui-form-item">閱讀需要支付1元查看</div>  
         <div   id="dv19dzv"   class="layui-form-item"><button class="btn-right">支付并查看</button></div>     
       </div>
      <script>
      var prei=0;

       
       $(".site-seo-depict pre").each(function(){
          var html=$(this).html().replace("<code>","").replace("</code>","").replace('<code class="javascript hljs" codemark="1">','');
          $(this).attr('data-clipboard-text',html).attr("id","pre"+prei);
          $(this).html("").append("<code>"+html+"</code>");
         prei++;
       })
           $(".site-seo-depict img").each(function(){
             
            if($(this).attr("src").indexOf('data:image/svg+xml')!= -1){
                $(this).remove();
            }
       })
     $("LINK[href*='style-49037e4d27.css']").remove();
       $("LINK[href*='markdown_views-d7a94ec6ab.css']").remove();
layui.use(['jquery', 'layer','code'], function(){
  $("pre").attr("class","layui-code");
      $("pre").attr("lay-title","");
       $("pre").attr("lay-skin","");
  layui.code(); 
       $(".layui-code-h3 a").attr("class","copycode").html("復(fù)制代碼 ").attr("onclick","copycode(this)");
      
});
function copycode(target){
    var id=$(target).parent().parent().attr("id");
  
                  var clipboard = new ClipboardJS("#"+id);

clipboard.on('success', function(e) {


    e.clearSelection();
    alert("復(fù)制成功")
});

clipboard.on('error', function(e) {
    alert("復(fù)制失敗")
});
}
//$(".site-seo-depict").html($(".site-seo-depict").html().slice(0, -5));
</script>
  <link rel="stylesheet" type="text/css" href="http://specialneedsforspecialkids.com/yun/static/js/neweditor/code/styles/tomorrow-night-eighties.css">
    <script src="http://specialneedsforspecialkids.com/yun/static/js/neweditor/code/highlight.pack.js" type="text/javascript"></script>
    <script src="http://specialneedsforspecialkids.com/yun/static/js/clipboard.js"></script>

<script>hljs.initHighlightingOnLoad();</script>

<script>
    function setcode(){
        var _html='';
    	  document.querySelectorAll('pre code').forEach((block) => {
        	  var _tmptext=$.trim($(block).text());
        	  if(_tmptext!=''){
        		  _html=_html+_tmptext;
        		  console.log(_html);
        	  }
    		 
    		  
    		 
      	  });
    	 

    }

</script>

<script>
function payread(){
  layer.open({
      type: 1,
      title:"付費閱讀",
      shadeClose: true,
      content: $('#payread')
    });
}
// 舉報
function jupao_tip(){
  layer.open({
      type: 1,
      title:false,
      shadeClose: true,
      content: $('#jubao')
    });

}
$(".getcommentlist").click(function(){
var _id=$(this).attr("dataid");
var _tid=$(this).attr("datatid");
$("#articlecommentlist"+_id).toggleClass("hide");
var flag=$("#articlecommentlist"+_id).attr("dataflag");
if(flag==1){
flag=0;
}else{
flag=1;
//加載評論
loadarticlecommentlist(_id,_tid);
}
$("#articlecommentlist"+_id).attr("dataflag",flag);

})
$(".add-comment-btn").click(function(){
var _id=$(this).attr("dataid");
$(".formcomment"+_id).toggleClass("hide");
})
$(".btn-sendartcomment").click(function(){
var _aid=$(this).attr("dataid");
var _tid=$(this).attr("datatid");
var _content=$.trim($(".commenttext"+_aid).val());
if(_content==''){
alert("評論內(nèi)容不能為空");
return false;
}
var touid=$("#btnsendcomment"+_aid).attr("touid");
if(touid==null){
touid=0;
}
addarticlecomment(_tid,_aid,_content,touid);
})
 $(".button_agree").click(function(){
 var supportobj = $(this);
         var tid = $(this).attr("id");
         $.ajax({
         type: "GET",
                 url:"http://specialneedsforspecialkids.com/yun/index.php?topic/ajaxhassupport/" + tid,
                 cache: false,
                 success: function(hassupport){
                 if (hassupport != '1'){






                         $.ajax({
                         type: "GET",
                                 cache:false,
                                 url: "http://specialneedsforspecialkids.com/yun/index.php?topic/ajaxaddsupport/" + tid,
                                 success: function(comments) {

                                 supportobj.find("span").html(comments+"人贊");
                                 }
                         });
                 }else{
                	 alert("您已經(jīng)贊過");
                 }
                 }
         });
 });
 function attenquestion(_tid,_rs){
    	$.ajax({
    //提交數(shù)據(jù)的類型 POST GET
    type:"POST",
    //提交的網(wǎng)址
    url:"http://specialneedsforspecialkids.com/yun/favorite/topicadd.html",
    //提交的數(shù)據(jù)
    data:{tid:_tid,rs:_rs},
    //返回數(shù)據(jù)的格式
    datatype: "json",//"xml", "html", "script", "json", "jsonp", "text".
    //在請求之前調(diào)用的函數(shù)
    beforeSend:function(){},
    //成功返回之后調(diào)用的函數(shù)
    success:function(data){
    	var data=eval("("+data+")");
    	console.log(data)
       if(data.code==2000){
    	layer.msg(data.msg,function(){
    	  if(data.rs==1){
    	      //取消收藏
    	      $(".layui-layer-tips").attr("data-tips","收藏文章");
    	      $(".layui-layer-tips").html('<i class="fa fa-heart-o"></i>');
    	  }
    	   if(data.rs==0){
    	      //收藏成功
    	      $(".layui-layer-tips").attr("data-tips","已收藏文章");
    	      $(".layui-layer-tips").html('<i class="fa fa-heart"></i>')
    	  }
    	})
    	 
       }else{
    	layer.msg(data.msg)
       }


    }   ,
    //調(diào)用執(zhí)行后調(diào)用的函數(shù)
    complete: function(XMLHttpRequest, textStatus){
     	postadopt=true;
    },
    //調(diào)用出錯執(zhí)行的函數(shù)
    error: function(){
        //請求出錯處理
    	postadopt=false;
    }
 });
}
</script>
<footer>
        <div   id="vflxlvn"   class="layui-container">
            <div   id="1dnzpp7"   class="flex_box_zd">
              <div   id="jfdfvph"   class="left-footer">
                    <h6><a href="http://specialneedsforspecialkids.com/"><img src="http://specialneedsforspecialkids.com/yun/static/theme/ukd//images/logo.png" alt="UCloud （優(yōu)刻得科技股份有限公司）"></a></h6>
                    <p>UCloud （優(yōu)刻得科技股份有限公司）是中立、安全的云計算服務(wù)平臺，堅持中立，不涉足客戶業(yè)務(wù)領(lǐng)域。公司自主研發(fā)IaaS、PaaS、大數(shù)據(jù)流通平臺、AI服務(wù)平臺等一系列云計算產(chǎn)品，并深入了解互聯(lián)網(wǎng)、傳統(tǒng)企業(yè)在不同場景下的業(yè)務(wù)需求，提供公有云、混合云、私有云、專有云在內(nèi)的綜合性行業(yè)解決方案。</p>
              </div>
              <div   id="399pb1b"   class="right-footer layui-hidemd">
                  <ul class="flex_box_zd">
                      <li>
                        <h6>UCloud與云服務(wù)</h6>
                         <p><a href="http://specialneedsforspecialkids.com/site/about/intro/">公司介紹</a></p>
                         <p><a  >加入我們</a></p>
                         <p><a href="http://specialneedsforspecialkids.com/site/ucan/onlineclass/">UCan線上公開課</a></p>
                         <p><a href="http://specialneedsforspecialkids.com/site/solutions.html" >行業(yè)解決方案</a></p>                                                  <p><a href="http://specialneedsforspecialkids.com/site/pro-notice/">產(chǎn)品動態(tài)</a></p>
                      </li>
                      <li>
                        <h6>友情鏈接</h6>                                             <p><a >GPU算力平臺</a></p>                                             <p><a >UCloud私有云</a></p>
                                             <p><a >SurferCloud</a></p>                                             <p><a >工廠仿真軟件</a></p>                                             <p><a >Pinex</a></p>                                             <p><a >AI繪畫</a></p>
                                             
                      </li>
                      <li>
                        <h6>社區(qū)欄目</h6>
                         <p><a href="http://specialneedsforspecialkids.com/yun/column/index.html">專欄文章</a></p>
                     <p><a href="http://specialneedsforspecialkids.com/yun/udata/">專題地圖</a></p>                      </li>
                      <li>
                        <h6>常見問題</h6>
                         <p><a href="http://specialneedsforspecialkids.com/site/ucsafe/notice.html" >安全中心</a></p>
                         <p><a href="http://specialneedsforspecialkids.com/site/about/news/recent/" >新聞動態(tài)</a></p>
                         <p><a href="http://specialneedsforspecialkids.com/site/about/news/report/">媒體動態(tài)</a></p>                                                  <p><a href="http://specialneedsforspecialkids.com/site/cases.html">客戶案例</a></p>                                                
                         <p><a href="http://specialneedsforspecialkids.com/site/notice/">公告</a></p>
                      </li>
                      <li>
                          <span><img src="https://static.ucloud.cn/7a4b6983f4b94bcb97380adc5d073865.png" alt="優(yōu)刻得"></span>
                          <p>掃掃了解更多</p></div>
            </div>
            <div   id="nlpd7vb"   class="copyright">Copyright ? 2012-2023 UCloud 優(yōu)刻得科技股份有限公司<i>｜</i><a rel="nofollow" >滬公網(wǎng)安備 31011002000058號</a><i>｜</i><a rel="nofollow" ></a> 滬ICP備12020087號-3</a><i>｜</i> <script type="text/javascript" src="https://gyfk12.kuaishang.cn/bs/ks.j?cI=197688&fI=125915" charset="utf-8"></script>
<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?290c2650b305fc9fff0dbdcafe48b59d";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-DZSMXQ3P9N"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-DZSMXQ3P9N');
</script>
<script>
(function(){
var el = document.createElement("script");
el.src = "https://lf1-cdn-tos.bytegoofy.com/goofy/ttzz/push.js?99f50ea166557aed914eb4a66a7a70a4709cbb98a54ecb576877d99556fb4bfc3d72cd14f8a76432df3935ab77ec54f830517b3cb210f7fd334f50ccb772134a";
el.id = "ttzz";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(el, s);
})(window)
</script></div> 
        </div>
    </footer>

<footer>
<div class="friendship-link">
<p>感谢您访问我们的网站，您可能还对以下资源感兴趣：</p>
<a href="http://specialneedsforspecialkids.com/" title="国产xxxx99真实实拍">国产xxxx99真实实拍</a>

<div class="friend-links">

<a href="http://belistarlp.com/">国产黄色在线</a>
</div>
</div>

</footer>

<script>
(function(){
    var bp = document.createElement('script');
    var curProtocol = window.location.protocol.split(':')[0];
    if (curProtocol === 'https') {
        bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
    }
    else {
        bp.src = 'http://push.zhanzhang.baidu.com/push.js';
    }
    var s = document.getElementsByTagName("script")[0];
    s.parentNode.insertBefore(bp, s);
})();
</script>
</body><div id="fhznb" class="pl_css_ganrao" style="display: none;"><strike id="fhznb"><dl id="fhznb"><meter id="fhznb"><tt id="fhznb"></tt></meter></dl></strike><track id="fhznb"></track><sup id="fhznb"></sup><ol id="fhznb"><big id="fhznb"></big></ol><form id="fhznb"><strong id="fhznb"><legend id="fhznb"><ol id="fhznb"></ol></legend></strong></form><progress id="fhznb"><font id="fhznb"><track id="fhznb"><i id="fhznb"></i></track></font></progress><ruby id="fhznb"><strike id="fhznb"></strike></ruby><em id="fhznb"></em><i id="fhznb"><em id="fhznb"><dfn id="fhznb"><thead id="fhznb"></thead></dfn></em></i><tt id="fhznb"><rp id="fhznb"></rp></tt><label id="fhznb"><dl id="fhznb"></dl></label><output id="fhznb"><label id="fhznb"><strong id="fhznb"><p id="fhznb"></p></strong></label></output><label id="fhznb"><form id="fhznb"></form></label><style id="fhznb"><label id="fhznb"><p id="fhznb"><pre id="fhznb"></pre></p></label></style><video id="fhznb"></video><progress id="fhznb"><em id="fhznb"></em></progress><thead id="fhznb"><em id="fhznb"><track id="fhznb"><label id="fhznb"></label></track></em></thead><rp id="fhznb"><dfn id="fhznb"></dfn></rp><span id="fhznb"></span><dfn id="fhznb"><dfn id="fhznb"></dfn></dfn><listing id="fhznb"><legend id="fhznb"></legend></listing><label id="fhznb"><listing id="fhznb"><legend id="fhznb"><sup id="fhznb"></sup></legend></listing></label><p id="fhznb"><thead id="fhznb"></thead></p><style id="fhznb"><em id="fhznb"><ol id="fhznb"><strike id="fhznb"></strike></ol></em></style><form id="fhznb"></form><i id="fhznb"><form id="fhznb"><output id="fhznb"><u id="fhznb"></u></output></form></i><thead id="fhznb"><rp id="fhznb"><dfn id="fhznb"><sup id="fhznb"></sup></dfn></rp></thead><strong id="fhznb"></strong><ruby id="fhznb"><style id="fhznb"></style></ruby><em id="fhznb"></em><th id="fhznb"><big id="fhznb"><dfn id="fhznb"><ol id="fhznb"></ol></dfn></big></th><menuitem id="fhznb"><tt id="fhznb"><strong id="fhznb"><meter id="fhznb"></meter></strong></tt></menuitem><ruby id="fhznb"></ruby><font id="fhznb"><var id="fhznb"></var></font><big id="fhznb"><small id="fhznb"><track id="fhznb"><form id="fhznb"></form></track></small></big><strong id="fhznb"><pre id="fhznb"></pre></strong><progress id="fhznb"><address id="fhznb"></address></progress><rp id="fhznb"><optgroup id="fhznb"><var id="fhznb"><progress id="fhznb"></progress></var></optgroup></rp><em id="fhznb"><track id="fhznb"><form id="fhznb"><nobr id="fhznb"></nobr></form></track></em><sub id="fhznb"><nobr id="fhznb"><pre id="fhznb"><sup id="fhznb"></sup></pre></nobr></sub><pre id="fhznb"></pre><small id="fhznb"><dfn id="fhznb"><i id="fhznb"><dl id="fhznb"></dl></i></dfn></small><track id="fhznb"></track><address id="fhznb"></address><acronym id="fhznb"><legend id="fhznb"><b id="fhznb"><label id="fhznb"></label></b></legend></acronym><thead id="fhznb"><video id="fhznb"><strong id="fhznb"><sup id="fhznb"></sup></strong></video></thead><strike id="fhznb"></strike><pre id="fhznb"><var id="fhznb"></var></pre><meter id="fhznb"><sub id="fhznb"></sub></meter><menuitem id="fhznb"></menuitem><dfn id="fhznb"><ruby id="fhznb"><b id="fhznb"><ins id="fhznb"></ins></b></ruby></dfn><dl id="fhznb"></dl><tt id="fhznb"><video id="fhznb"></video></tt><small id="fhznb"><th id="fhznb"><form id="fhznb"><video id="fhznb"></video></form></th></small><var id="fhznb"></var><nobr id="fhznb"><legend id="fhznb"></legend></nobr><u id="fhznb"><label id="fhznb"><div id="fhznb"><u id="fhznb"></u></div></label></u><style id="fhznb"></style><strong id="fhznb"><sup id="fhznb"></sup></strong><label id="fhznb"><strong id="fhznb"><legend id="fhznb"><thead id="fhznb"></thead></legend></strong></label><ruby id="fhznb"><tt id="fhznb"><video id="fhznb"><dfn id="fhznb"></dfn></video></tt></ruby><thead id="fhznb"><dl id="fhznb"><legend id="fhznb"><thead id="fhznb"></thead></legend></dl></thead><p id="fhznb"><pre id="fhznb"><progress id="fhznb"><form id="fhznb"></form></progress></pre></p><dl id="fhznb"><div id="fhznb"></div></dl><u id="fhznb"></u><p id="fhznb"><thead id="fhznb"></thead></p><tt id="fhznb"><listing id="fhznb"></listing></tt><nobr id="fhznb"></nobr><track id="fhznb"></track><b id="fhznb"></b><meter id="fhznb"><label id="fhznb"></label></meter><track id="fhznb"></track><th id="fhznb"></th><ins id="fhznb"><em id="fhznb"><menuitem id="fhznb"><u id="fhznb"></u></menuitem></em></ins><strong id="fhznb"></strong><meter id="fhznb"><sub id="fhznb"><video id="fhznb"><pre id="fhznb"></pre></video></sub></meter><thead id="fhznb"><nobr id="fhznb"></nobr></thead><dfn id="fhznb"><sup id="fhznb"><ins id="fhznb"><optgroup id="fhznb"></optgroup></ins></sup></dfn><menuitem id="fhznb"></menuitem><font id="fhznb"></font><th id="fhznb"></th><address id="fhznb"><ruby id="fhznb"></ruby></address><span id="fhznb"><rp id="fhznb"></rp></span><progress id="fhznb"><dfn id="fhznb"><pre id="fhznb"><big id="fhznb"></big></pre></dfn></progress><small id="fhznb"><ruby id="fhznb"><label id="fhznb"><listing id="fhznb"></listing></label></ruby></small><strike id="fhznb"><dl id="fhznb"></dl></strike><label id="fhznb"></label><strike id="fhznb"><small id="fhznb"><var id="fhznb"><progress id="fhznb"></progress></var></small></strike><font id="fhznb"></font><form id="fhznb"><listing id="fhznb"></listing></form><menuitem id="fhznb"></menuitem><rp id="fhznb"></rp><form id="fhznb"><dl id="fhznb"><output id="fhznb"><label id="fhznb"></label></output></dl></form><em id="fhznb"></em><sub id="fhznb"><video id="fhznb"><optgroup id="fhznb"><var id="fhznb"></var></optgroup></video></sub><video id="fhznb"><strong id="fhznb"></strong></video><sup id="fhznb"></sup><big id="fhznb"></big><sup id="fhznb"><video id="fhznb"></video></sup><label id="fhznb"><dl id="fhznb"><legend id="fhznb"><b id="fhznb"></b></legend></dl></label><thead id="fhznb"><font id="fhznb"></font></thead><p id="fhznb"><span id="fhznb"></span></p><nobr id="fhznb"><p id="fhznb"></p></nobr><i id="fhznb"><form id="fhznb"><menuitem id="fhznb"><tt id="fhznb"></tt></menuitem></form></i><meter id="fhznb"><span id="fhznb"></span></meter><progress id="fhznb"></progress><progress id="fhznb"></progress><div id="fhznb"><thead id="fhznb"><mark id="fhznb"><form id="fhznb"></form></mark></thead></div><th id="fhznb"></th><b id="fhznb"></b><span id="fhznb"><nobr id="fhznb"><strong id="fhznb"><dfn id="fhznb"></dfn></strong></nobr></span><thead id="fhznb"></thead><dfn id="fhznb"><var id="fhznb"></var></dfn><var id="fhznb"><thead id="fhznb"><acronym id="fhznb"><div id="fhznb"></div></acronym></thead></var><u id="fhznb"><listing id="fhznb"></listing></u><nobr id="fhznb"><dfn id="fhznb"><var id="fhznb"><strike id="fhznb"></strike></var></dfn></nobr><listing id="fhznb"><p id="fhznb"><thead id="fhznb"><video id="fhznb"></video></thead></p></listing><dl id="fhznb"><meter id="fhznb"></meter></dl><i id="fhznb"><form id="fhznb"></form></i><listing id="fhznb"><p id="fhznb"><thead id="fhznb"><video id="fhznb"></video></thead></p></listing><b id="fhznb"><acronym id="fhznb"><th id="fhznb"><style id="fhznb"></style></th></acronym></b><strong id="fhznb"><th id="fhznb"><label id="fhznb"><form id="fhznb"></form></label></th></strong><span id="fhznb"><rp id="fhznb"></rp></span><form id="fhznb"><menuitem id="fhznb"><form id="fhznb"><strong id="fhznb"></strong></form></menuitem></form><dfn id="fhznb"></dfn><ol id="fhznb"><thead id="fhznb"><form id="fhznb"><meter id="fhznb"></meter></form></thead></ol><sub id="fhznb"></sub><legend id="fhznb"></legend><th id="fhznb"></th><track id="fhznb"><label id="fhznb"></label></track><legend id="fhznb"><span id="fhznb"><ins id="fhznb"><optgroup id="fhznb"></optgroup></ins></span></legend><legend id="fhznb"></legend><acronym id="fhznb"></acronym><thead id="fhznb"><nobr id="fhznb"></nobr></thead><label id="fhznb"><form id="fhznb"><output id="fhznb"><u id="fhznb"></u></output></form></label><progress id="fhznb"><acronym id="fhznb"><legend id="fhznb"><tt id="fhznb"></tt></legend></acronym></progress><form id="fhznb"><strong id="fhznb"></strong></form><p id="fhznb"><span id="fhznb"></span></p><sup id="fhznb"><mark id="fhznb"><pre id="fhznb"><ol id="fhznb"></ol></pre></mark></sup><thead id="fhznb"><font id="fhznb"><var id="fhznb"><ins id="fhznb"></ins></var></font></thead><form id="fhznb"></form><sup id="fhznb"><rp id="fhznb"><strong id="fhznb"><ol id="fhznb"></ol></strong></rp></sup><track id="fhznb"></track><font id="fhznb"></font><progress id="fhznb"><small id="fhznb"><th id="fhznb"><label id="fhznb"></label></th></small></progress><label id="fhznb"></label><tt id="fhznb"></tt><track id="fhznb"></track><p id="fhznb"><span id="fhznb"><rp id="fhznb"><pre id="fhznb"></pre></rp></span></p><var id="fhznb"><thead id="fhznb"><form id="fhznb"><menuitem id="fhznb"></menuitem></form></thead></var></div>
<script src="http://specialneedsforspecialkids.com/yun/static/theme/ukd/js/common.js"></script>
<<script type="text/javascript">
$(".site-seo-depict *,.site-content-answer-body *,.site-body-depict *").css("max-width","100%");
</script>
</html>