微信小程序界面设计CSS3在小程序中样式精通课程-第30课-调整尺寸(Resizing)_小程序中CSS3_前端样式教程

联系我们我要留言

小程序中CSS3: 微信小程序界面设计CSS3在小程序中样式精通课程-第30课-调整尺寸(Resizing)
时间：2019/1/13 14:28:45  作者：互联网  来源：网络转载  查看：23847  评论：0
内容摘要：调整尺寸(Resizing)通用语法在 CSS3，resize 属性规定是否可由用户调整元素尺寸。实例规定 div 元素可由用户调整大小： div{border:2...
调整尺寸(Resizing)

通用语法

在 CSS3，resize 属性规定是否可由用户调整元素尺寸。

实例

规定 div 元素可由用户调整大小：

<!DOCTYPE html>

<html>

<head>

<style>

div

{

border:2px solid;

padding:10px 40px;

width:300px;

resize:both;

overflow:auto;

}

</style>

</head>

<body>

<div>resize 属性规定是否可由用户调整元素尺寸。</div>

<p><b>注释：</b> Firefox 4+、Safari 以及 Chrome 支持 resize 属性。</p>

</body>

</html>

效果图

小程序应用

Wxml代码

<view class='c01'>

调整属性

</view>

Wxss代码

.c01{

     border:2px solid;

     padding:10px 40px;

     width:100px;

     resize:both;

     overflow:auto;

}

效果图

欢迎大家收看我的视频课程：微信小程序界面设计-小程序中CSS3样式精通课程


标签：调整尺寸(Resizing) 微信小程序界面设计入门课程 wxss中css3入门在线视频课程
上一篇：微信小程序界面设计CSS3在小程序中样式精通课程-第31课-外形修饰（outline-offset）
下一篇：微信小程序界面设计CSS3在小程序中样式精通课程-第29课-多列-Columns 列的宽度和列数