建站
咨詢(xún)
售后
建站咨詢(xún)
新聞中心
本文的一些測(cè)試結(jié)果不是出自我手，來(lái)自：How Do Browsers Render the Different CSS Border Style Values?
10年積累的做網(wǎng)站、成都做網(wǎng)站經(jīng)驗(yàn)，可以快速應(yīng)對(duì)客戶(hù)對(duì)網(wǎng)站的新想法和需求。提供各種問(wèn)題對(duì)應(yīng)的解決方案。讓選擇我們的客戶(hù)得到更好、更有力的網(wǎng)絡(luò)服務(wù)。我雖然不認(rèn)識(shí)你，你也不認(rèn)識(shí)我。但先網(wǎng)站制作后付款的網(wǎng)站建設(shè)流程，更有西安免費(fèi)網(wǎng)站建設(shè)讓你可以放心的選擇與我們合作。
以下是測(cè)試使用的代碼：
- .box {
- width: 50px;
- height: 50px;
- border-width: 5px;
- border-color: #444; /* 后面會(huì)改成 "pink" 調(diào)個(gè)休 */
- border-style: dotted; /* dashed, double, groove, ridge, inset, outset */
- }
Value: dotted
各個(gè)瀏覽器對(duì)比結(jié)果如下：
上面的對(duì)比結(jié)果直接把IE6給無(wú)視了（下同），唉，人家生活在American，國(guó)情不一樣哈。IE7~IE8鉆石形狀，IE10全部可愛(ài)圓點(diǎn)，其他瀏覽器，自己看圖吧。
哪個(gè)是正統(tǒng)？
IE10的渲染已經(jīng)接近規(guī)范的描述。圓角渲染最靠譜的應(yīng)該是FireFox瀏覽器。
Value: dashed
所有瀏覽器都是方條條，不過(guò)長(zhǎng)度啊，空白間距啊都有挺標(biāo)新立異的。
哪個(gè)是正統(tǒng)？
根據(jù)規(guī)范定義，貌似哪個(gè)都對(duì)。如果您非要一大堆螃蟹里挑出個(gè)陽(yáng)澄湖大閘蟹的話(huà)，F(xiàn)ireFox那個(gè)丑陋的鳥(niǎo)樣更準(zhǔn)確些。
Value: double
考驗(yàn)大家眼力的時(shí)候到了，找出其中不循規(guī)蹈矩的那一個(gè)。哦呵呵，恭喜你，找對(duì)了，就是IE10版本的邊框，顏色淡了那么一點(diǎn)點(diǎn)。
哪個(gè)是正統(tǒng)？
雖然真理往往掌握在少數(shù)人手中，但是，常識(shí)往往掌握在大多數(shù)人手中。我就不說(shuō)什么了。
Value: groove
groove是凹槽的意思。不同瀏覽器下groove的長(zhǎng)相就像女人一樣，花樣百變。我再一次就不說(shuō)什么了。
哪個(gè)是正統(tǒng)？
根據(jù)測(cè)試者的認(rèn)識(shí)，沒(méi)有一個(gè)是真正正確的，可能作者稍微摳了一點(diǎn)，顏色的變化應(yīng)該是“曲線式”的，但是，上面沒(méi)有一個(gè)是這樣的。
Value: ridge
ridge是山脊的意思。從效果來(lái)看，ridge和groove真稱(chēng)得上“奸夫淫婦”的美名哈。
哪個(gè)是正統(tǒng)？
雖然長(zhǎng)相不一，其實(shí)大家都是正確的。只不過(guò)都不是100% OK的那種。Firefox, Safari, 和Chrome應(yīng)該是最準(zhǔn)確的。
Value: inset
IE7和IE8的內(nèi)陷的陰影真是好陰暗哦，果然應(yīng)了那句話(huà)，相由心生。
哪個(gè)是正統(tǒng)？
除了IE7和IE8，其他瀏覽器的邊框都是可以豎大拇指滴。
Value: outset
IE好像都蠻黑的。但是，基本上還都過(guò)得去。Safari和Chrome的相貌是最好的。
哪個(gè)是正統(tǒng)？
不管你信不信，反正我是信了。IE7和IE8要比其他的來(lái)的更準(zhǔn)確。恩恩，其他瀏覽器最大的問(wèn)題在于就像個(gè)小胸的美女，難以區(qū)分前胸和后背?！眎nset”和”outset”長(zhǎng)得過(guò)于類(lèi)似。IE10尤其是個(gè)平胸女王，很容易讓男朋友以為晚上都是趴著睡的。
本文名稱(chēng)：拾人牙慧:不同瀏覽器如何渲染不同border-style值
鏈接URL：http://m.5511xx.com/article/djjgegj.html
