line-block的運用:最小寬度的設置
日期:2013-12-16 來源:攀枝花惠康網絡公司
網上找到的正規描述:
這個值導致矣閩元素發生一個塊狀盒模子(block box),而自己作為單一的內聯盒模子(inline box)流動枚舉(flow),近似一個被替代的元素。Display值為inline-block的元素內部形成一個塊狀盒模子,而本體態成近似一個內聯的被替代元素PS:可惜IE不撐持,FF也不撐持。HOHO~
IE解決方案:觸發IE的layout,年夜而使該元素具備近似line-block的特征。
.box { display:inline; zoom:1; min-width:400px; width:auto!important; width:400px; clear:right; border:1px solid #000; background:#ccc; }
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>
<html xmlns=”http://www.w3.org/1999/xhtml” lang=”zh-CN” xml:lang=”zh-CN”>
html:lang(zh-CN) .box { display:-moz-inline-box; }
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<meta name=”keywords” content=”PRcss,xhtml,html,css,js,book,小我主頁,無聊,神經,懶惰” />
<meta name=”description” content=”PRcss的小我主頁,無聊的,神經的,懶惰的…” />
<meta name=”Author” content=”PRcss,qq:50198763″ />
<meta name=”Copyright” content=”本頁版權歸PRcss所有。All Rights Reserved” />
<link rel=”shortcut icon” href=http://www.css88.com/archives/”http://www.pr1984.com/favicon.ico” />
<style type=”text/css”><!–
<title>line-block的運用:最小寬度的設置 – www.pr1984.com</title>
.box img { display:block; width:100px; height:300px; background:#c00; }
–></style>
FF解決方案:使用moz專試試性:display::-moz-inline-box;
</head>
<body>
line-block:自己是內聯盒模子的存在,又具備塊狀盒模子的特征。很好很強年夜的工具啊~
<p class=”box”>
<img src=http://www.css88.com/archives/”pr.jpg” />
</p>
<p>測試</p>
</html>
</body>
文章來源:攀枝花惠康網絡公司
惠康網絡,是一家專業從事攀枝花網站建設,攀枝花網站制作,攀枝花網站設計公司,提供網站建設一條龍服務(網站域名注冊+網站服務器租用+網站開發+網站維護+網站營銷推廣),惠康網絡立足攀枝花,輻射全中國,攀枝花惠康網絡的客戶已經遍布國內各地大中小城市,我們高效優質的網站建設服務深受用戶好評。