页面布局
介绍
有木部形的视图展出 限XL限NN型的批成其中，WXSS(WaXm Sy6 Sm)是年手CSS拓展的样式语言、用于描述WXML的组成边框(border)祥式，决定WXML的组件如何显示。WXSS具有---Css的大部分特性
盒子模型
介绍：小程序页面中的元素布局模型，类似于网页中的盒子模型。它由四个基本属性组成：内容(content)、填充(padding)、边框(border)和边距(margin)。
块级元素与行内元素
块级元素
介绍
块级元素默认占一行高度，一行内通常只有一个块级元素(浮动后除外)，添加新级元素时，会自动换行，块级元素一般作为盒子出现。
块级元素的特点
(1)一个块级元素占一行。
(2)块级元素的默认高度由内容决定，除非自定义高度。
(3)块级元素的默认宽度是父级元素的内容区宽度，除非自定义宽度
(4)块级元素的宽度、高度、外边距及内边距都可以自定义设置。
(5)块级元素可以容纳块级元素和行内元素
<view/>组件默认为块级元素，使用<view/>组件演示盒子模型及块级元素的示例码如下:
<view style="border: 1px solid #fff;">块级元素1</view>
<view style="border: 1px solid #0f0;margin: 15px; padding: 20px;">块级元素2</view>
<view style="border: 1px solid #00f;width: 200px; height: 80px;">块级元素3</view>
<view style="border: 1px solid #ccc;">
<view style="height: 60px;">块级元素4</view>
</view>
<view style="border: 1px solid #fff; width: 100px ;background-color: #ccc;"></view>
效果图
行内元素
介绍
行内元素，不必从新一行开始，通常会与前后的其他行内元素显示在同一行中，它们不占有的区域，仅靠自身内容支撑结构，一般不可以设置大小，常用于控制页面中文本的样式。将一个元素的 display 属性设置为 imline 后，该元素即被设置为行内元素。
行内元素的特点
(1)行内元素不能被设置高度和宽度，其高度和宽度由内容决定,
(2)行内元素内不能放置块级元素，只级容纳文本或其他行内元素
(3)同一块内，行内元素和其他行内元素显示在同一行。
<texV>组件默认为行内元素，使用<view/>及<texV. >组件演示盒的示例代码如下:
<view style="padding: 20px;">
<text style="border: 1px solid #f00;">文本1</text>
<text style="border: 1px solid #0f0; display: inline;">块级元素设置为行内元素</text>
一行显示不全，自动换行显示
</view>
效果图
行内块元素
当元素的 display 属性被设置为 imline -block 时，元素被设置为行内块元素。行内可以被设置高度、宽度、内边距和外边距。
示例代码如下:
<view>
元素显示方法的<view style="display: inline-block; border: 1px solid #f00;margin: 10px;padding: 10px;width: 200px;">行内块元素、行内元素、块级元素</view>
</view>
运行效果
浮动与定位
浮动
元素浮动就是指设置了浮动属性的元素会脱离标准文档流的控制，移到其父元素中指定位置的过程。在CSS中，通过foat属性来定义浮动，
其基本格式如下
float:none lleft lright;
其中，none--默认值，表示元素不浮动;
lef--元素向左浮动;
right--元素向右浮动。
在下面的示例代码中，分别对box1、box2、box3元素左浮动:
<view>box1,box2,box3 元素没有浮动</view>
<view style="border: 1px solid #f00;padding: 5px;">
<view style="border: 1px solid #0f0;">box1</view>
&
