国产 无码 综合区,色欲AV无码国产永久播放,无码天堂亚洲国产AV,国产日韩欧美女同一区二区

  1. Toy模板網(wǎng)首頁
  2. >Toy博客

CSS3:圖片邊框

2年前作者：白的夜gxw分類：Toy博客閱讀(18)違法舉報

這篇具有很好參考價值的文章主要介紹了CSS3:圖片邊框。希望對大家有所幫助。如果存在錯誤或未考慮完全的地方，請大家不吝賜教，您也可以點擊"舉報違法"按鈕提交疑問。

簡介

圖片也可以作為邊框，以下是實例演示

注意

實現(xiàn)該效果必須添加border樣式，且必須位于border-image-socure之前否則不會生效

實例

CSS3:圖片邊框,CSS,css3,javascript,前端文章來源地址http://www.zghlxwxcb.cn/news/detail-651494.html

<html lang="en">
  <head>
    <style>
      p {
        width: 600px;
        margin: 200px auto;
        border: 30px solid;
        //核心代碼-------------------
        border-image-source: url(img.jpg);//設置圖片來源
        border-image-slice: 30;			  //設置切割大小
        border-image-repeat: round;       //設置填充模式
        //核心代碼-------------------
        padding: 35px;
        color: aliceblue;
        box-shadow: 15px 15px 10px #929696;
      }
    </style>
  </head>
  <body>
    <p>
      Lorem, ipsum dolor sit amet consectetur adipisicing elit. A, consectetur? Dignissimos officiis
      iure beatae non ipsum sed temporibus nisi quas. Iste dolorem minus quis. Adipisci
      necessitatibus eligendi illo rerum recusandae. Sed dolore laudantium natus rem ex pariatur,
      laborum officiis esse! Delectus tenetur mollitia alias distinctio temporibus dolore. Corrupti,
      et voluptate? Non est molestias magnam recusandae porro nihil obcaecati nobis rerum. Porro
      quisquam in quis molestias dolores corporis, earum animi voluptatibus! Eligendi alias
      dignissimos at ipsam totam iusto voluptatibus odio dicta. Excepturi cumque voluptatum enim
      aspernatur quo non dolorum minus explicabo. Praesentium necessitatibus nulla cum quaerat
      numquam sed consequuntur culpa sequi.
    </p>
  </body>
</html>

到了這里，關于CSS3:圖片邊框的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章，希望大家以后多多支持TOY模板網(wǎng)！

本文來自互聯(lián)網(wǎng)用戶投稿，該文觀點僅代表作者本人，不代表本站立場。本站僅提供信息存儲空間服務，不擁有所有權，不承擔相關法律責任。如若轉載，請注明出處： 如若內(nèi)容造成侵權/違法違規(guī)/事實不符，請點擊違法舉報進行投訴反饋，一經(jīng)查實，立即刪除！

領支付寶紅包贊助服務器費用

相關文章

覺得文章有用就打賞一下文章作者

支付寶掃一掃打賞

博客贊助

微信掃一掃打賞

請作者喝杯咖啡吧~博客贊助

支付寶掃一掃領取紅包，優(yōu)惠每天領

二維碼1

領取紅包

二維碼2

領紅包