下面是關于HTML5中通過CSS3實現的圖形化邊界實例的相關內容,文章教程主要講述與HTML5 CSS3 圖形化 邊界 相關的一些技術與知識,更多的內容歡迎大家訪問http://www.49028c.com,獲取更多最新教程,下面是教程講解:
顧名思義,圖形化邊界就是允許使用圖片作為對象的邊界,語法如下:
border: 5px solid #cccccc;
-webkit-border-image: url(/images/border-image.png) 5 repeat;
-moz-border-image: url(/images/border-image.png) 5 repeat;
border-image: url(/images/border-image.png) 5 repeat;
這里,border: 5px 設定了邊界的寬度,然后,每個邊界的圖片定義告訴瀏覽器,使用圖片的多大一部分來充當邊界。邊界圖片還可以針對每一條邊單獨設置:
border-bottom-rightright-image
border-bottom-image
border-bottom-left-image
border-left-image
border-top-left-image
border-top-image
border-top-rightright-image
border-right-image
支持的瀏覽器: Firefox 3.1, Safari , Chrome.
關于HTML5中通過CSS3實現的圖形化邊界實例文章就講到這里,歡迎瀏覽本站的其它內容,點擊這里返回首頁
新聞熱點
疑難解答