CSS3属性之resize
生活随笔
收集整理的這篇文章主要介紹了
CSS3属性之resize
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
resize需與overflow配合使用，overflow上一篇寫過了，直接在上一節的基礎上講一下resize
resize可以讓用戶重新調整overflow屬性值為非visible的元素的寬高，有?both / horizontal /?vertical 三種屬性值
1.both：允許用戶調整元素的寬高【例1】
2.horizontal：允許用戶調整元素的寬度【例2】
3.vertical：允許用戶調整元素的高度【例3】
【例1】both
效果：
<!DOCTYPE html> <html lang="en"><head><style>* {margin: 0;padding: 0;}.wrapper {position: absolute;left: 100px;top: 100px;width: 200px;height: 200px;border: 1px solid #333;border-radius: 10px;color: #424242;overflow: auto;resize: both;}.content {width: 250px;height: 250px;padding: 20px;border: 1px solid #33f;border-radius: 10px;background-color: rgba(200, 255, 200, 0.5);}</style> </head><body><div class="wrapper"><div class="content"><p>我們在之前的一本著作中研究群體觀念對各國發展的影響時已經指出，每一種文明都是少數幾個基本觀念的產物，這些觀念很少能夠得到革新。我們指出，這些觀念在群體的心中是多么穩固，要想對這一過程產生影響是多么困難，以及這些觀念一旦實現之后所擁有的力量。最后我們又說，歷史的波動就是這些基本觀念的改變所引發的結果。</p></div></div> </body></html>【例2】horizontal：將上述代碼resize屬性值改為horizontal
效果
只能改變寬度【例3】vertical：將上述代碼resize屬性值改為vertical
效果
只能改變高度?
超強干貨來襲 云風專訪：近40年碼齡，通宵達旦的技術人生總結
以上是生活随笔為你收集整理的CSS3属性之resize的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： css3盒模型：IE6混杂模式下的盒模型
- 下一篇： CSS3的弹性盒子flex详解（1）