微信小程序开发边做边学 课件 知识点篇-微信小程序第5章 申请课程号

小程序开发从入门到实践知识点课程页面模块开发申请课程号知识点小程序开发申请课程号由于照搬了豆豆云的后台，因此涉及到“加入课程”的概念，开发者需要向后台申请一个课程，得到课程号，申请链接如下：/index.php/Api/User/createCourse?appid=123&courseName=1028教学&questionSet=1012&creater=大佬appid代表开发者小程序的appid，courseName代表要创建的课程的名字，开发者可自定义，questionSet代表实现预设的题目集（后续无法更改），creater代表创建者。小程序开发申请课程号其中对questionSet的题目集，后台提供了8个题目集供开发者选择，具体详见表

题目集id题目集名称题目数量1001近代史题库12871002浙江工商大学新生入学考试题库12761003计算机网络题库2191008C语言二级模拟考试题库1201009毛概题库17661010C语言训练题13951011马克思主义基本原理概论20591012思修道德修养与法律基础1561课程模块页面布局知识点小程序开发课程信息模块页面布局1.课程信息模块主要包括课程名称、课程创建者、加入课程的人数以及课程号2.对于课程信息模块的页面布局，同样可以参考WeUI样式中表单-List-带图标、说明的列表项，如图所示。带图标、说明的列表项小程序开发找到对应的WeUI样式后，将该样式的对应代码复制黏贴到自己的项目代码中。带图标、说明的列表项具体代码如下：课程信息模块页面布局小程序开发其中课程信息模块wxml代码如下：小程序开发class和style的区别在上图中的wxml代码中我们经常会发现一个view属性中既有class="weui-cell__hd"，又有style="position:relative;margin-right:10px;"虽然这他们都可以实现页面的修改，但是两者之间还是有区别的。比如在myinfo页面添加一个button做测试，该button的wxml代码如下：另外在myinfo.wxss中添加test样式，test样式中主要是跟style中一样定义了字体颜色，该样式代码如下：小程序开发该button在style中color属性值为蓝色，class调用test样式中color属性值为红色，无论如何修改test样式中color属性的值，按钮字体颜色都是蓝色，如图所示。在wxml当中前端读取数据都是通过就近原则，所以style是直接在页面语句中进行编写，在程序执行的时候，style>class。测试button的字体颜色小程序开发2.position属性定义建立元素布局所用的定位机制。任何元素都可以定位，不过绝对或固定元素会生成一个块级框，而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。值描述absolute生成绝对定位的元素，相对于static定位以外的第一个父元素进行定位。元素的位置通过"left","top","right"以及"bottom"属性进行规定。fixed生成绝对定位的元素，相对于浏览器窗口进行定位。元素的位置通过"left","top","right"以及"bottom"属性进行规定。relative生成相对定位的元素，相对于其正常位置进行定位。因此，"left:20"会向元素的LEFT位置添加20像素。static默认值。没有定位，元素出现在正常的流中（忽略top,bottom,left,right或者z-index声明）。inherit规定应该从父元素继承position属性的值。position属性的值小程序开发3.margin-right属性margin-right属性设置元素的右外边距，允许使用负值。margin-right属性的值详见表。值描述auto浏览器设置的右外边距。length定义固定的右外边距。默认值是0。%定义基于父对象总高度的百分比右外边距。inherit规定应该从父元素继承右外边距。小程序开发修改课程练习模块image属性中margin-right的值为10px和100px，页面效果如图所示。margin-right值：10pxmargin-right值：100px小程序开发4.

display属性display属性规定元素应该生成的框的类型。用于定义建立布局时元素生成的显示框类型。对于HTML等文档类型，如果使用display不谨慎会很危险，因为可能违反HTML中已经定义的显示层次结构。对于XML，由于XML没有内置的这种层次结构，所有display是绝对必要的。display属性的值详见表。值描述none此元素不会被显示。block此元素将显示为块级元素，此元素前后会带有换行符。inline默认。此元素会被显示为内联元素，元素前后没有换行符。inline-block行内块元素。（CSS2.1新增的值）list-item此元素会作为列表显示。run-in此元素会根据上下文作为块级元素或内联元素显示。table此元素会作为块级表格来显示（类似<table>），表格前后带有换行符。inline-table此元素会作为内联表格来显示（类似<table>），表格前后没有换行符。table-row-group此元素会作为一个或多个行的分组来显示（类似<tbody>）。table-header-group此元素会作为一个或多个行的分组来显示（类似<thead>）。table-footer-group此元素会作为一个或多个行的分组来显示（类似<tfoot>）。table-row此元素会作为一个表格行显示（类似<tr>）。table-column-group此元素会作为一个或多个列的分组来显示（类似<colgroup>）。table-column此元素会作为一个单元格列显示（类似<col>）。table-cell此元素会作为一个表格单元格显示（类似<td>和<th>）table-caption此元素会作为一个表格标题显示（类似<caption>）inherit规定应该从父元素继承display属性的值。小程序开发课程练习模块页面布局其中涉及到了float、box-sizing和width三种属性。float属性float属性定义元素在哪个方向浮动。任何元素都可以浮动。浮动元素会生成一个块级框，而不论它本身是何种元素。如果浮动非替换元素，则要指定一个明确的宽度；否则，它们会尽可能地窄。其中float可能的值详见表。值描述left元素向左浮动。right元素向右浮动。none默认值。元素不浮动，并会显示在其在文本中出现的位置。inherit规定应该从父元素继承float属性的值。小程序开发2.box-sizing属性box-sizing属性允许以特定的方式定义匹配某个区域的特定元素。例如，假如需要并排放置两个带边框的框，可通过将box-sizing设置为"border-box"。这可令页面呈现出带有指定宽度和高度的框，并把边框和内边距放入框中。其中box-sizing属性的值详见表。值描述content-box宽度和高度分别应用到元素的内容框。在宽度和高度之外绘制元素的内边距和边框。border-box为元素设定的宽度和高度决定了元素的边框盒。就是说，为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。inherit规定应从父元素继承box-sizing属性的值。小程序开发3.width属性width属性设置元素的宽度。这个属性定义元素内容区的宽度，在内容区外面可以增加内边距、边框和外边距。行内非替换元素会忽略这个属性。其中width属性可能的值详见表。值描述auto默认值。浏览器可计算出实际的宽度。length使用px、cm等单位定义宽度。%定义基于包含块（父元素）宽度的百分比宽度。inherit规定应该从父元素继承width属性的值。小程序开发作业思考讨论题如何在代码中宏定义课程号？课程信息模块中image组件的style样式，如果使用wxss文件要怎么实现？如何灵活地使用与border相关的属性？获取当前课程逻辑中不使用getCurrentCourse方法，如何实现获取当前课程信息。小程序开发二.单选题微信小程序向后台请求数据时关于method:'POST'和method:'GET'以下说法错误的是？Get是用来从服务器上获得数据，而Post是用来向服务器上传递数据Get是不安全的，因为在传输过程，数据被放在请求的URL中Get传输的数据量大，这主要是因为受URL长度限制；而Post可以传输少量的数据，所以在上传文件只能使用Get使用Post传输的数据，可以通过设置编码的方式正确转化中文；而Get传输的数据却没有变化小程序开发二.单选题2.以下关于CSSposition的属性值，说法错误的是？absolute生成绝对定位的元素，相对于static定位以外的第一个父元素进行定位fixed生成绝对定位的元素，相对于浏览器窗口进行定位。元素的位置通过"left","top","right"以及"bottom"属性进行规定relative生成相对定位的元素，相对于其正常位置进行定位，因此，"left:20"会向元素的LEFT位置添加20像素。static规定应该从父元素继承position属性的值小程序开发

3.以下关于CSSmargin-right属性说法错误的是？inherit规定应该从父元素继承左外边距。auto 浏览器设置的右外边距length定义固定的右外边距，默认值是0D。%定义基于父对象总高度的百分比右外边距4.以下关于display属性说法错误的是？display:inline内联元素只需要必要的宽度，不强制换行display:block块元素是一个元素，占用了全部宽度，在前后都是换行符。display:none可以隐藏某个元素display:hidden可以隐藏某个元素二.单选题小程序开发5.以下关于display:none和visibility:hidden哪个说法是正确的？visibility:hidden可以隐藏某个元素，但隐藏的元素仍需占用与未隐藏之前一样的空间display:none可以隐藏某个元素，且隐藏的元素会占用空间。也就是说，该元素不但被隐藏了，而且该元素依然会在页面布局中存在visibility:hidden可以隐藏某个元素，且隐藏的元素不会占用任何空间display:none可以隐藏某个元素，但隐藏的元素仍需占用与未隐藏之前一样的空间二.单选题小程序开发6.以下关于class和style的说法正确的是？在wxml当中前端读取数据都是通过就近原则所以style是直接在页面语句中的语句中进行编写，在程序执行的时候，style>classclass对应的样式优先级大于styleclass对应的样式响应先于styleclass对应的样式和style优先级相同

7.以下关于WXSS常用属性说法错误的是？background-color用于修改背景色color用于修改前景色border：3pxsolidblue表示宽度为3像素的蓝色实线border：3pxsolidblue表示长度为3像素的蓝色实线二.单选题小程序开