web前端开发中遇到的问题整理记录——2019-04

leoperfect 发布于2019-08-30 15:56 / 2849人阅读

摘要：目录匹配下标是奇数或偶数的子元素获取屏幕高度小程序显示不出的原因小程序状态栏沉浸式小程序引用图标正文匹配下标是奇数或偶数的子元素奇数偶数获取屏幕高度获取览器显示区域的高度获取浏览器显示区域的宽度获取页面的文档高度获取页面的文

1.css 匹配下标是奇数或偶数的子元素
2.获取屏幕高度
3.小程序tabbar显示不出的原因
4.小程序状态栏沉浸式
5.小程序引用iconfont图标

正文

1.css 匹配下标是奇数或偶数的子元素

    .item-order:nth-of-type(odd){
        border-left:3px solid #f5f5f5;
        //奇数
    }
    .item-order:nth-of-type(even){
        border-right:3px solid #f5f5f5;
       //偶数
    }

2.获取屏幕高度

获取览器显示区域的高度： $(window).height();

获取浏览器显示区域的宽度：$(window).width();

获取页面的文档高度：$(document).height();

获取页面的文档宽度：$(document).width();

获取滚动条到顶部的垂直高度：$(document).scrollTop() 或 $(window).scrollTop();

获取滚动条到左边的垂直宽度：$(document).scrollLeft() 或$(window).scrollLeft();
传送门1
传送门2

3.小程序tabbar显示不出的原因

pages数组的第一项必须是tabBar的list数组的一员

"pages":[
"pages/clickDemo/clickDemo",
"pages/logs/logs",
"pages/index/index",
"pages/mypage/mypage"
]

tabbar中list数组内容是：

"list": [
{
"pagePath": "pages/index/index",
"text": "首页",
"iconPath": "image/location_normal.png",
"selectedIconPath": "image/location_selected.png"
},
{
"pagePath": "pages/logs/logs",
"text": "设置",
"iconPath": "image/setting_normal.png",
"selectedIconPath": "image/setting_selecred.png"
}

如果不是自定义的tabbar, custom为true也会显示不出来，这个是笔者个人粗心犯得小错误，找了半天.....

4.小程序状态栏沉浸式

app.json 中 window 配置：navigationStyle:"custom"

5.小程序引用iconfont图标

1.在阿里图标库中找到需要的图标并加入项目

2.把项目下载项目到本地

3.在本地打开下载的目录将 iconfont.css文件改为iconfont.wxss复制到项目中

4.在app.wxss中引入iconfont.wxss

5.在阿里图标库我的项目中 点击复制代码

6.将复制的@font-face替换掉iconfont.wxss中的@font-face

7.在项目中引用

详细教程点击传送门

专线服务超融合服务器 winform?开发遇到问题布局遇到的问题简单的web开发问题学习遗传算法遇到的问题

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/117581.html

web前端开发中遇到的问题整理记录——2019-04

摘要：目录匹配下标是奇数或偶数的子元素获取屏幕高度小程序显示不出的原因小程序状态栏沉浸式小程序引用图标正文匹配下标是奇数或偶数的子元素奇数偶数获取屏幕高度获取览器显示区域的高度获取浏览器显示区域的宽度获取页面的文档高度获取页面的文目录 1.css 匹配下标是奇数或偶数的子元素2.获取屏幕高度3.小程序tabbar显示不出的原因4.小程序状态栏沉浸式5.小程序引用iconfont图标正文 ...

dendoink 2019-08-30 15:43 评论0 收藏0
element-ui日期时间选择器的日期格式化问题

摘要：最近在做的后台管理页面，其中用到了来选择日期时间，但是在将数据传回后台的过程中遇到了一些令人头疼的问题，在此记录一下解决方案，以免日后再次遇到。最近在做vue+element-ui的后台管理页面，其中用到了DateTimePicker来选择日期时间，但是在将数据传回后台的过程中遇到了一些令人头疼的问题，在此记录一下解决方案，以免日后再次遇到。 showImg(https://segm...

atinosun 2019-08-19 11:35 评论0 收藏0
前端培训-初级阶段 - xss相关（2019-04-18）

摘要：前端最基础的就是。但是如果是盗窃，异常提交请求，这些就属于危险操作。可以用来伪装成其他用户操作，有可能就会造成财产上的损失。劫持有的时候运营商的劫持还是没办法。前端最基础的就是 HTML+CSS+Javascript。掌握了这三门技术就算入门，但也仅仅是入门，现在前端开发的定义已经远远不止这些。前端小课堂（HTML/CSS/JS），本着提升技术水平，打牢基础知识的中心思想，我们开课啦...

VioletJack 2019-08-26 13:43 评论0 收藏0
【LNMPR源码学习】笔记汇总

摘要：此文用于汇总跟随陈雷老师及团队的视频，学习源码过程中的思考整理与心得体会，此文会不断更新视频传送门每日学习记录使用录像设备记录每天的学习源码学习源码学习内存管理笔记源码学习内存管理笔记源码学习内存管理笔记源码学习基本变量笔记此文用于汇总跟随陈雷老师及团队的视频，学习源码过程中的思考、整理与心得体会，此文会不断更新视频传送门：【每日学习记录】使用录像设备记录每天的学习 PHP7...

gougoujiang 2019-08-01 14:06 评论0 收藏0
【LNMPR源码学习】笔记汇总

摘要：此文用于汇总跟随陈雷老师及团队的视频，学习源码过程中的思考整理与心得体会，此文会不断更新视频传送门每日学习记录使用录像设备记录每天的学习源码学习源码学习内存管理笔记源码学习内存管理笔记源码学习内存管理笔记源码学习基本变量笔记此文用于汇总跟随陈雷老师及团队的视频，学习源码过程中的思考、整理与心得体会，此文会不断更新视频传送门：【每日学习记录】使用录像设备记录每天的学习 PHP7...

aristark 2019-07-24 16:34 评论0 收藏0