社区
黄菊华的课程社区_NO_4
微信小程序实战-企业站界面设计
帖子详情
企业站界面-首页-区块标题
黄菊华老师
博客专家认证
2023-01-13 00:23:04
课时名称
课时知识点
企业站界面-首页-区块标题
企业站界面-首页-区块标题
...全文
14
回复
打赏
收藏
企业站界面-首页-区块标题
课时名称课时知识点企业站界面-首页-区块标题企业站界面-首页-区块标题
复制链接
扫一扫
分享
转发到动态
举报
写回复
配置赞助广告
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
相关推荐
黑色个性
企业
站
模板
首页
PSD文件
黑色模板 网
站
PSD源文件 个性
企业
站
模板 黑色
企业
站
模板
首页
文件,最近收集了一些素材做了一个黑色的模板,
首页
PSD文件。
9.4 资讯列表
界面
开发
企业
站
uni-app实战【uni-app教程uniapp教程(黄菊华-跨平台开发系列教程)】
9.4 资讯列表 本小节主要讲解资讯列表页面的制作,效果如图9-12。 布局分析:我们在“
企业
站
首页
-最新资讯”这里分析过类似的布局,我们可以沿用前面的布局和样式;唯一需要变动的是讲
区块
标题
右侧的内容删除。 布局代码如下: <template> <view> <!--最新资讯--
区块
标题
--> <view class='qukuai'> <view class='qukuai-shuxian'></view><
9.1.2 公司简介
界面
开发
企业
站
uni-app实战【uni-app教程uniapp教程(黄菊华-跨平台开发系列教程)】
9.1.2 公司简介 公司简介
区块
最终效果如图9-3,公司简介由
区块
标题
和
区块
内容组成。 布局分析:公司简介、最新产品、最新案例、最新资讯都会用到“
区块
标题
”,只是每个
区块
不同,然后
标题
文字不同,所以我们要单独为该
区块
写独立的代码和样式,以便于我们公用样式。 布局代码如下: <!--公司简介-
区块
标题
--> <view class='qukuai'> <view class='qukuai-shuxian'></view><!--
区块
标题
-左侧竖线
9.1.5 最新资讯
界面
开发
企业
站
uni-app实战【uni-app教程uniapp教程(黄菊华-跨平台开发系列教程)】
9.1.5 最新资讯 最新资讯
区块
效果如图9-6。 布局分析:每条资讯分1行2列,左侧放资讯
标题
,右侧放图标;左侧的资讯
标题
占据所有剩余空间,将右侧的图标挤压到最右侧。 布局代码如下: <!--最新资讯--
区块
标题
--> <view class='qukuai'> <view class='qukuai-shuxian'></view><!--
区块
标题
-左侧竖线--> <text class='qukuai-biaoti'>最
9.1.3 最新产品
界面
开发
企业
站
uni-app实战【uni-app教程uniapp教程(黄菊华-跨平台开发系列教程)】
9.1.3 最新产品 最新产品
区块
效果如图9-4。 布局分析:最新产品
区块
的
标题
我们使用公司简介的代码,
区块
标题
的样式是公用的;产品显示
区块
,我们这里做一个1行2列的流式布局,也就是我们每个产品的内容占据整个手机宽度的50%,那么1行就可以放2个产品了。 注意:我们每个产品的图片image中添加属性 mode=‘widthFix’ ,表示图片高度自动随图片高度自适应按比例变化。 布局代码如下: <!--最新产品(1行2列流式布局) 开始--> <view class='cp_zuixi
黄菊华的课程社区_NO_4
1
社区成员
414
社区内容
发帖
与我相关
我的任务
黄菊华的课程社区_NO_4
专注大学生计算机教育和毕业设计辅导
复制链接
扫一扫
分享
社区描述
专注大学生计算机教育和毕业设计辅导
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告