当前位置： 首页 > news >正文

实验十 智能手机互联网程序设计（微信程序方向）实验报告

news 2026/5/21 21:09:49
  • 实验目的和要求

               

  • 完成以下页面设计。

 

   

  

  

二、实验步骤与结果（给出对应的代码或运行结果截图）

Wxml

<view class="container">

  <view class="header">

      <view class="logo">标志</view>

      <view class="nav">

        <view>首页</view>

        <view>产品</view>

        <view>关于我们</view>

      </view>

  </view>

<view class="feature">特色内容</view>

  <view class="main">

    <view class="content">

        <view class="section">内容部分 1</view>

        <view class="section">内容部分 2</view>

        <view class="section">内容部分 3</view>

      </view>

        <view class="sidebar">侧边栏链接</view>

  </view>

  <view class="footer">

    <view class="footer-section">

        <view>联系电话</view>

        <view>电话：123-456-7890</view>

    </view>

      <view class="footer-section">

        <view>快速链接</view>

        <view>常见问题</view>

        <view>支持服务</view>

    </view>

      <view class="footer-section">

        <view>版权信息</view>

        <view>2024 公司名</view>

    </view>

  </view>

</view>

Wxss

.container{

  display: flex;

  flex-direction: column;

  height: 100vh;

}

.header{

  display: flex;

  height: 60rpx;

  background-color: rgb(85, 84, 84);

  color: white;

  justify-content: center;

  padding: 0 20rpx;

}

.nav{

  flex-grow: 2;

  display: flex;

  justify-content: space-around;

}

.feature{

  height: 100rpx;

  background-color: rgb(123, 194, 212);

  display: flex;

  justify-content: center;

  align-items: center;

  color: white;

}

.main{

  flex-grow: 1;

  flex-basis: 0;

  display: flex;

}

.content{

  flex-grow: 3;

  flex-basis: 0;

  display: flex;

  flex-direction: column;

  padding: 10rpx;

}

.section{

  flex-grow: 1;

  margin: 10rpx;

  background-color:  rgb(153, 212, 230);

  display: flex;

  justify-content: center;

  align-items: center;

}

.sidebar{

  flex-grow: 1;

  flex-basis: 0;

  background-color: rgb(149, 215, 235);

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

}

.footer{

  height: 200rpx;

  display: flex;

  background-color: rgb(85, 84, 84);

  color: white;

  justify-content: center;

}

.footer-section{

  display: flex;

  flex-direction: column;

  align-items: center;

}

三、问题总结与体会

思路

相关文章：

实验十 智能手机互联网程序设计（微信程序方向）实验报告

实验目的和要求 完成以下页面设计。 二、实验步骤与结果&#xff08;给出对应的代码或运行结果截图&#xff09; Wxml <view class"container"> <view class"header"> <view class"logo"…...

编程日记 2024/5/14 21:40:02

Python图形复刻——绘制母亲节花束

各位小伙伴&#xff0c;好久不见&#xff0c;今天学习用Python绘制花束。 有一种爱&#xff0c;不求回报&#xff0c;有一种情&#xff0c;无私奉献&#xff0c;这就是母爱。祝天下妈妈节日快乐&#xff0c;幸福永远&#xff01; 图形展示&#xff1a; 代码展示&#xff1a; …...

编程日记 2024/5/14 21:39:00

【算法优选】 动态规划之子数组、子串系列——壹

文章目录 &#x1f38b;前言&#x1f38b;最大子数组和&#x1f6a9;题目描述&#x1f6a9;算法思路&#x1f6a9;代码实现 &#x1f334;环形子数组的最大和&#x1f6a9;题目描述&#x1f6a9;算法思路&#xff1a;&#x1f6a9;代码实现 &#x1f332;乘积最大子数组&#x…...

编程日记 2024/5/14 21:36:58

PXE+Kickstart无人值守安装安装Centos7.9

文章目录 一、什么是PXE1、简介2、工作模式3、工作流程 二、什么是Kickstart1、简介2、触发方式 三、无人值守安装系统工作流程四、实验部署1、环境准备2、服务端&#xff1a;关闭防火墙和selinux3、添加一张仅主机的网卡4、配置仅主机的网卡4.1、修改网络连接名4.2、配IP地址4…...

编程日记 2024/5/14 21:35:56

C语言实现通讯录，包括增删改查以及动态开辟内存，写入文件等功能

文章目录 前言一、注意二、源码1. test.c源文件2. contact.h头文件3. contact.c源文件 总结 前言 C语言实现通讯录&#xff0c;包括增删改查以及动态开辟内存&#xff0c;写入文件等功能 一、注意 在通讯录菜单栏使用枚举定义PeoInfo类型时&#xff0c;每个结构体类型的成员…...

编程日记 2024/5/14 21:34:55

flowable多对并发网关跳转的分析

更多ruoyi-nbcio功能请看演示系统 gitee源代码地址 前后端代码&#xff1a; https://gitee.com/nbacheng/ruoyi-nbcio 演示地址&#xff1a;RuoYi-Nbcio后台管理系统 http://218.75.87.38:9666/ 更多nbcio-boot功能请看演示系统 gitee源代码地址 后端代码&#xff1a; h…...

编程日记 2024/5/14 21:31:50

【嵌入式——QT】QT集成Ymodem协议使用UDP进行传输

【嵌入式——QT】QT集成Ymodem协议使用UDP进行传输 Ymodem协议帧的数据格式帧头包号校验 通讯过程握手信号起始帧数据帧结束帧代码块 Ymodem命令 QT实现YmodemFileTransmit.hYmodemFileTransmit.cppBootLoader.hBootLoader.cppYmodem协议源码 Ymodem协议 帧的数据格式 帧头、…...

编程日记 2024/5/14 21:30:48

python笔记（17）输入输出

一、标准输入与输出简介 Python通过内置的sys模块管理标准输入&#xff08;stdin&#xff09;、标准输出&#xff08;stdout&#xff09;和标准错误&#xff08;stderr&#xff09;。但对大多数简单应用而言&#xff0c;直接使用内置函数就足够了。 二、输入&#xff1a;inpu…...

编程日记 2024/5/14 21:25:42

408数据结构总结复习笔记一：线性表

408数据结构总结复习笔记一&#xff1a;线性表 从现在开始慢慢更新我的考研复习笔记系列吧~ PS&#xff1a;主要是我自己个人复习过程中觉得重点的点&#xff0c;大家仅供参考哈~ 上岸&#xff01;&#xff01;&#xff01;大家一起加油! 顺序表和链表的比较 顺序表链表存取…...

编程日记 2024/5/14 21:24:41

Docker——目录迁移

我们在生产环境中安装Docker时&#xff0c;默认的安装目录是/var/lib/docker&#xff0c;而通常情况下&#xff0c;规划给系统盘的目录一般为50G&#xff0c;该目录是比较小的&#xff0c;一旦容器过多或容器日志过多&#xff0c;就可能出现Docker无法运行的情况&#xff0c;所…...

编程日记 2024/5/14 21:21:37

SpringAMQP-消息转换器

这边发送消息接收消息默认是jdk的序列化方式&#xff0c;发送到服务器是以字节码的形式&#xff0c;我们看不懂也很占内存&#xff0c;所以我们要手动设置一下 我这边设置成json的序列化方式&#xff0c;注意发送方和接收方的序列化方式要保持一致 不然回报错。 引入依赖&#…...

编程日记 2024/5/14 21:19:35

轻松拿下指针（5）

文章目录 一、回调函数是什么二、qsort使用举例三、qsort函数的模拟实现 一、回调函数是什么 回调函数就是⼀个通过函数指针调⽤的函数。 如果你把函数的指针&#xff08;地址&#xff09;作为参数传递给另⼀个函数&#xff0c;当这个指针被⽤来调⽤其所指向的函数 时&#x…...

编程日记 2024/5/14 21:17:32

Nginx反向代理配置

一、介绍 Nginx 的反向代理功能在现代网络架构中扮演着至关重要的角色。首先&#xff0c;它充当了客户端与后端服务器之间的中介。当客户端发送请求时&#xff0c;这些请求先到达 Nginx 服务器&#xff0c;Nginx 会根据预先设定的规则和配置&#xff0c;将请求准确地转发到相应…...

编程日记 2024/5/14 21:16:31

突破编程界限：探索AI编程新境界

文章目录 一、AI编程助手1.1 Baidu Comate智能代码助手1.2 阿里云 通义灵码 二、场景需求三、体验步骤3.1 官网下载3.2 手动下载 四、试用感受4.1 提示4.2 注释生成代码4.3 代码生成4.4 选中生成注释4.5 查看变更&新建文件4.6 调优建议4.7 插件使用 五、结尾推荐 一、AI编程…...

编程日记 2024/5/14 21:14:28

C语言（指针）2

Hi~&#xff01;这里是奋斗的小羊&#xff0c;很荣幸各位能阅读我的文章&#xff0c;诚请评论指点&#xff0c;关注收藏&#xff0c;欢迎欢迎~~ &#x1f4a5;个人主页&#xff1a;小羊在奋斗 &#x1f4a5;所属专栏&#xff1a;C语言 本系列文章为个人学习笔记&#x…...

编程日记 2024/5/14 21:09:23

go学习笔记

1基础搭建 1.1&#xff0c;安装vscode https://code.visualstudio.com/download 64位 1.2&#xff0c;Windows 下搭建Go 开发环境-安装和配置 SDK SDK 的全称(Software Development Kit 软件开发工具包) Go 语言的官网为&#xff1a;golang.org , 因为各种原因&#xff0c;可…...

编程日记 2024/5/14 21:06:20

MacApp自动化测试之Automator初体验

今天我们继续讲Automator的使用。 初体验 启动Automator程序&#xff0c;选择【工作流程】类型。从资源库区域依次将获取指定的URL、从网页中获得文本、新建文本文件三个操作拖进工作流创建区域。 然后修改内容&#xff0c;将获取指定的URL操作中的URL替换成https://www.cnb…...

编程日记 2024/5/14 21:03:17

Vue学习v-html

Vue学习v-html 一、前言1、基本用法2、注意事项 二、总结 一、前言 学习 Vue.js 中的 v-html 指令意味着你想要在你的应用程序中动态地渲染 HTML。这个指令允许你将数据中包含的 HTML 代码直接插入到你的模板中&#xff0c;而不是将其作为纯文本处理。虽然这个功能非常强大&am…...

编程日记 2024/5/14 21:00:14

C++并发：锁

一、前言 C中的锁和同步原语的多样化选择使得程序员可以根据具体的线程和数据保护需求来选择最合适的工具。这些工具的正确使用可以大大提高程序的稳定性和性能&#xff0c;本文讨论了部分锁。 二、std::lock 在C中&#xff0c;std::lock 是一个用于一次性锁定两个或多个互斥…...

编程日记 2024/5/14 20:57:10

Git | git log 和 git status 的区别

如是我闻&#xff1a; git log和git status是Git中的两个非常有用的命令&#xff0c;它们用于不同的目的&#xff0c;并提供不同类型的信息。 git log git log命令用于显示一个或多个分支的提交历史记录。这个命令会列出提交历史&#xff0c;包括每次提交的SHA-1哈希值、提交…...

编程日记 2024/5/14 20:56:09

数字孪生 · 零基础4周速成学习计划（书籍+实操+项目落地）

适合&#xff1a;零基础、物联网专业、想转行数字孪生、做项目、毕设、求职学习搭配&#xff1a;理论书籍 软件实操 协议打通 完整Demo项目第一周&#xff1a;建立体系&#xff08;看懂数字孪生到底是什么&#xff09;&#x1f4da; 阅读书籍&#xff1a;《数字孪生及车间实…...

编程新知 2026/5/21 19:50:32

避坑指南：华为云Stack OBS 3.0对象存储部署，小型化与标准化方案到底怎么选？

华为云Stack OBS 3.0部署选型实战&#xff1a;小型化与标准化方案深度对比 当企业级用户面对华为云Stack OBS 3.0对象存储部署时&#xff0c;第一个关键决策点往往出现在架构形态的选择上——是采用轻量灵活的小型化方案&#xff0c;还是选择高扩展性的标准化部署&#xff1f;这…...

编程新知 2026/5/21 18:40:58

TrafficMonitor插件宝典：打造你的全能桌面监控中心

TrafficMonitor插件宝典&#xff1a;打造你的全能桌面监控中心 【免费下载链接】TrafficMonitorPlugins 用于TrafficMonitor的插件 项目地址: https://gitcode.com/gh_mirrors/tr/TrafficMonitorPlugins 想要在桌面上实时监控股票行情、硬件状态、天气信息&#xff0c;却…...

编程新知 2026/5/21 18:38:47

对比直接使用官方 API，Taotoken 在计费透明性上的优势体验

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 对比直接使用官方 API&#xff0c;Taotoken 在计费透明性上的优势体验 对于需要调用多种大语言模型的开发者而言&#xff0c;成本控…...

编程新知 2026/5/21 17:54:22

ARM SVE存储指令ST1D与ST1H深度解析与优化

1. ARM SVE存储指令深度解析在ARMv8架构的可扩展向量扩展(SVE)指令集中&#xff0c;ST1D和ST1H指令扮演着关键角色。这些指令专为高效的内存存储操作设计&#xff0c;特别适合处理大规模数据集的场景。与传统的标量存储指令相比&#xff0c;它们能同时处理多个数据元素&#xf…...

编程新知 2026/5/21 17:43:17

终极二维码修复指南：免费在线工具QrazyBox完整使用教程

终极二维码修复指南&#xff1a;免费在线工具QrazyBox完整使用教程 【免费下载链接】qrazybox QR Code Analysis and Recovery Toolkit 项目地址: https://gitcode.com/gh_mirrors/qr/qrazybox 你是否遇到过重要二维码因为打印模糊、咖啡渍或物理磨损而无法扫描的困扰&a…...

编程新知 2026/5/21 12:44:34

2026年AI大模型API中转站主流服务商实测排名 性能成本与落地能力全维度深度对比

五大主流平台核心维度综合能力横向盘点2026年AI大模型已经全面跨入规模化落地阶段&#xff0c;国内日均AI Token调用总量突破140万亿量级&#xff0c;API聚合中转平台早已脱离最初简单协议转发层的定位&#xff0c;成为支撑企业AI能力落地的核心关键网关。平台运行稳定性、多协…...

编程新知 2026/5/21 12:31:21

避坑指南：ESP32驱动SD卡给LVGL用，我踩过的那些‘焊盘’和‘代码坑’

ESP32驱动SD卡与LVGL整合实战&#xff1a;从硬件焊接到软件调试的完整避坑手册 第一次将ESP32、SD卡和LVGL整合到同一个项目中时&#xff0c;我天真地以为这不过是简单的模块拼接。直到电路板上的焊锡冷却&#xff0c;代码编译通过却无法运行时&#xff0c;才意识到自己正踏入…...

编程新知 2026/5/21 12:12:04

不止于配置：用Qt给周立功CAN卡写个简易数据收发测试工具（附源码）

从零构建Qt版CAN数据收发测试工具&#xff1a;周立功硬件实战指南 在嵌入式开发领域&#xff0c;CAN总线调试是工程师日常工作中的高频需求。当我们需要验证硬件连接是否正常、测试通信质量或快速检查数据流时&#xff0c;一个轻量级的图形化测试工具能极大提升工作效率。本文将…...

编程新知 2026/5/21 11:43:24

AMD Ryzen处理器终极调试指南：免费开源SMUDebugTool完整使用教程

AMD Ryzen处理器终极调试指南&#xff1a;免费开源SMUDebugTool完整使用教程 【免费下载链接】SMUDebugTool A dedicated tool to help write/read various parameters of Ryzen-based systems, such as manual overclock, SMU, PCI, CPUID, MSR and Power Table. 项目地址: …...

编程新知 2026/5/21 11:31:06