企业官网小程序搭建教程-首页的搭建05
2022/1/11 22:05:58
本文主要是介绍企业官网小程序搭建教程-首页的搭建05,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
目录
01 总体介绍
02 首页搭建第一部分
03 首页搭建第二部分
04 首页搭建第三部分
05 首页搭建第四部分
我们上一节完成了首页部分最新动态的搭建,已经可以正常显示企业的新闻了,本节我们就完成首页的最后一部分搭建,合作伙伴部分展示。
登录控制台,打开首页,在页面里添加普通容器组件
输入如下样式:
top: 24px; width: 710px; position: relative; margin-top: 0px; background: rgb(255, 255, 255); margin-left: 20px; border-radius: 16px; padding-bottom: 20px
在里边添加一个普通容器,并放置一个文本组件用来显示标题
普通容器设置如下样式:
display: inline-block; margin-top: 24px; margin-left: 40px
文本组件设置如下样式:
height: 44px; font-size: 32px; font-weight: bolder; white-space: pre-line
修改文本内容为合作伙伴
然后再增加一个普通容器用来显示合作伙伴的LOGO
设置如下样式:
width: 710px; margin-top: 20px
在里边添加一个普通容器,并且放置图片组件
普通容器设置如下样式
width: 214px; height: 100px; display: inline-block; margin-top: 10px; text-align: justify; margin-left: 16px; box-shadow: 0px 2px 20px 2px #F2F4F8; border-radius: 8px
图片组件设置如下样式
width: 166px; height: 55px; margin-top: 28px; text-align: justify; margin-left: 24px
因为有多个合作伙伴,因此需要在容器上绑定循环变量
绑定合作伙伴变量
然后将图片的地址绑定为具体的图片地址
合作伙伴就开发好了
这样我们就完成了首页的开发。
这篇关于企业官网小程序搭建教程-首页的搭建05的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-05-302024年最新版云开发cms开通步骤,开始开发微信小程序前的准备工作,认真看完奥!
- 2024-03-30微信小程序的网络设置,及网络请求:wx.request(OBJECT)
- 2024-01-22基于taro搭建小程序多项目框架
- 2024-01-13小程序开发:在插件市场寻找步骤条组件并二开
- 2024-01-05钉钉小程序生态—企业机器人加互动卡片,改善用户体验的开始!
- 2023-12-29【UniApp】-uni-app-打包成小程序
- 2023-12-26性能翻倍!京东亿级体量小程序优化实践
- 2023-12-25小程序优化:第三方SDK过大解决方案
- 2023-11-26微信小程序文件预览和下载-文件系统
- 2023-11-2652天学习微信小程序计划No.2:注册小程序账号&安装开发者工具