在學習css的時候，寫出來一個CSS緞帶效果，感覺還不錯，下面小編就來帶你們瞭解一下
<!DOCTYPE HTML><html><head><style type="text/css">.ribbon-content {border: 1px solid #DDD;font-weight: bold;margin: 0 -10px;min-height: 30px;padding: 7px 31px;text-align: center;line-height: 30px;}.ribbon-left {display: block;border-left: 10px solid white;border-top: 8px solid #EEE;float: left;height: 0;margin-left: -10px;width: 0;}.ribbon-right {display: block;border-right: 10px solid white;border-top: 8px solid #EEE;float: right;height: 0;margin-right: -10px;width: 0;}</style></head><body><p style="margin: 0 auto; width: 200px;"><p class="ribbon" style="background: whiteSmoke;"><p class="ribbon-content" style="background: whiteSmoke;">標題</p><p class="ribbon-left"></p><p class="ribbon-right"></p></p><p style="background: whiteSmoke;">內容內容內容內容內容內容內容內容內容內容內容內容內容內容內容內容內容內容</p></p></body></html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
