您好,登錄后才能下訂單哦!
css中如何使用column-rule-color屬性?這個(gè)問(wèn)題可能是我們?nèi)粘W(xué)習(xí)或工作經(jīng)常見(jiàn)到的。希望通過(guò)這個(gè)問(wèn)題能讓你收獲頗深。下面是小編給大家?guī)?lái)的參考內(nèi)容,讓我們一起來(lái)看看吧!
css column-rule-color屬性指定元素分列顯示時(shí),列與列之間分隔線的顏色規(guī)則。注:要先設(shè)置好列之間的樣式規(guī)則,顏色規(guī)則才能生效。
css column-rule-color屬性怎么用?
column-rule-color屬性規(guī)定列之間的顏色規(guī)則。
語(yǔ)法:
column-rule-color: color;
屬性值:
● color:規(guī)定顏色規(guī)則。
注釋:
Internet Explorer 10 和 Opera 支持 column-rule-color 屬性。Firefox 支持替代的 -moz-column-rule-color 屬性。Safari 和 Chrome 支持替代的 -webkit-column-rule-color 屬性。Internet Explorer 9 以及更早版本的瀏覽器不支持 column-rule-color 屬性。
css column-rule-color屬性 示例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> .newspaper { column-count:3; column-gap:40px; column-rule-style:outset; column-rule-color:#ff0000; /* Firefox */ -moz-column-count:3; -moz-column-gap:40px; -moz-column-rule-style:outset; -moz-column-rule-color:#ff0000; /* Safari and Chrome */ -webkit-column-count:3; -webkit-column-gap:40px; -webkit-column-rule-style:outset; -webkit-column-rule-color:#ff0000; } </style> </head> <body> <p><b>注意:</b> Internet Explorer 9及更早 IE 版本瀏覽器不支持 column-count 屬性。</p> <div class="newspaper"> 當(dāng)我年輕的時(shí)候,我夢(mèng)想改變這個(gè)世界;當(dāng)我成熟以后,我發(fā)現(xiàn)我不能夠改變這個(gè)世界,我將目光縮短了些,決定只改變我的國(guó)家;當(dāng)我進(jìn)入暮年以后,我發(fā)現(xiàn)我不能夠改變我們的國(guó)家,我的最后愿望僅僅是改變一下我的家庭,但是,這也不可能。當(dāng)我現(xiàn)在躺在床上,行將就木時(shí),我突然意識(shí)到:如果一開(kāi)始我僅僅去改變我自己,然后,我可能改變我的家庭;在家人的幫助和鼓勵(lì)下,我可能為國(guó)家做一些事情;然后,誰(shuí)知道呢?我甚至可能改變這個(gè)世界。 </div> </body> </html>
效果圖:
感謝各位的閱讀!看完上述內(nèi)容,你們對(duì)css中如何使用column-rule-color屬性大概了解了嗎?希望文章內(nèi)容對(duì)大家有所幫助。如果想了解更多相關(guān)文章內(nèi)容,歡迎關(guān)注億速云行業(yè)資訊頻道。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。