美文网首页
HBuildwr·图文列表

HBuildwr·图文列表

作者: 85酒吧 | 来源:发表于2021-01-19 06:40 被阅读0次

现在是1月14日,今天有在主体内容添加图文列表。

在开始之前看下目前的布局,上面是“顶部导航”,导航栏左侧是蓝色填充的头像图标,右侧是有填充的设置图标,这两个图标可以点击,但点击之后没有响应,因为根本没有子页面可以跳转,嘿嘿,我还不会。

导航栏中间是“仁·义·礼·智·信”五个字,代表我对孩子的期望。

在导航栏下面是主体部分,引用了自设的css文件,设定内容间距上下0px,左右15px,px是像素的意思。

主体里面首先放了七张孩子帅气的照片,按照3000毫秒一张的速度进行轮播,在图片下面中间的部位有随图片变动的小圆点,之所以说得这么详细,是因为小圆点虽然看起来简单,但也是单独的一组代码,搞定它可花了我一番功夫,请原谅我这个小白。

图片轮播碰到的问题还有图片不显示,这点在添加自己的图片并修改代码里的图片地址后就好了。

最大的问题是刚开始它竟然只能手动左右拖动,不自动轮播,一直显示第一张图片,这个问题反复复制粘贴好几次都不行,仔细对照视频里的代码和操作也不行,最后在网络上搜索了一段代码才ok,和之前的代码做比对仅仅差几个字母,结果大为不同。

今天用图文列表的方式做“任务栏”、“进行中的任务”和“积分兑换”三个部分,这三个名字不咋滴,先用着,后续再找类似“混沌神殿”之类的名字填上去。

做图文列表碰到的问题有背景色和边框之间没有间距,主体是有设定左右留15px的空白。又是反反复复好几遍试不同代码,最后发现原来整段代码放在了body的下面,既主体之外了,所以间距的设定不起作用,调整位置后ok。

明天要做的是调整图文列表每一栏的高度,可以显示更多的内容。

加油!

ฅ۶•ﻌ•

相关文章

  • HBuildwr·图文列表

    现在是1月14日,今天有在主体内容添加图文列表。 在开始之前看下目前的布局,上面是“顶部导航”,导航栏左侧是蓝色填...

  • ListView和SimpleAdapter(图文列表)

    目录 SimpltAdapter(简单适配器) 其实这个适配器并不简单,功能很强大. simpleAdapter中...

  • 自适应缩放图文列表

    前端入坑纪 50 今天比较闲,再来分享下,最近真切体会到flex很好用,那就讲讲吧。 好,详解如下! OK,fir...

  • NowView 1.0+ README

    Now 一款Android图文精选app,通过抓取网页获得图文列表。目前包含站酷(Zcool)精选、国家地理(Na...

  • 项目目录

    项目:电子商城 主页 完善home组件的内容 Promise和新闻资讯 图片列表 商品列表 商品详情 图文介绍和评...

  • 固定的div中图片的适配显示

    在很多平台的新闻,博客列表中都能见到有图文显示,因为新闻,博客等列表都也许不是平台发布的,无法控制很多图片的大小尺...

  • react-14-商城列表

    1. 前言 1.1 列表类的界面是我们经常用到的1.2 这个写下图文混排,也就是商城类的列表界面1.3 这篇文章都...

  • Flutter 图文并茂列表完整实现

    列表在 App 中是最常见的形式了,在 Flutter 中提供了 ListView 这个组件来实现列表,本篇将通过...

  • 营销类设计-2021

    一、公众号 图文封面 “消息列表”和“内容推荐” 的尺寸为2.35:1 【1080*460px】【1000*426...

  • 商品展示列表——大图、多图、图文列表该如何选择?

    一、大图展示 大图展示是指一行只展示一张图片,由于其图片占比较大,因此往往一屏只能展示1到2张,适合以图片为主单一...

网友评论

      本文标题:HBuildwr·图文列表

      本文链接:https://www.haomeiwen.com/subject/npibaktx.html