栏目: CSS/HTML

Sass常用备忘案例详解

一、变量所有变量以$开头$font_size:12px;.container{font-size:$font_size;}如果变量嵌套在字符串中,需要写在#{}中$side:left;.rounded{border-#{$side}:1pxsolid#000;} 二、嵌套层级嵌套.container...

2021-09-18 98 0 0 阅读全文

Element Table HandleSpan合并单元格通用方法

element合并单元格通用方法。主要思路:对数据进行处理,写了一个getSpanData通用方法。用api中提供的span-method方法。span-method方法用法:通过给table传入span-method方法可以实现合并行或列,方法的参数是一个对象,里面包含当前行row、当前列colu...

2021-07-07 194 0 0 阅读全文

10分钟了解Z-Index机制

俾众周知,CSS是前端的一门DSL语言,虽然不具备图灵完备,但是它在样式渲染这一领域里更加形象的描述了一个事物,在当下娱乐、信息、多元化时代背景下CSS的地位越发凸显,今天我们来聊聊CSS中的Z-index属性回顾Z-index的例子.box1{width:100px;height:100px;ba...

2021-07-13 212 0 0 阅读全文

微信小程序实现根据日期和时间排序功能

一、最近接手了一个小程序的项目,有这样一个需求要对列表进行日期和时间的排序,于是小试牛刀,操作了一番,终于搞出来,在这里给大家总结分享一下经验,希望对大家有一定的帮助。二、需求分析(这是已完成的效果)这里有具体的日期时间和具体的小时时间,后端数据给我传来的是这样式的startDate:"2...

2021-09-07 117 0 0 阅读全文

Html Form表单基础入门案例讲解

一,表格标签向网页中加入表格–1,概述测试表格标签11132122233132–2,总结table标签用来表示表格tr标签表示表里的一行td标签表示行里的列border设置边框cellspacing设置单元格的间距bgcolor设置背景色width设置宽度height设置高度colspan合并列ro...

2021-07-13 169 0 0 阅读全文

微信小程序自定义导航栏,胶囊菜单按钮高度完美适配

在自定义小程序导航栏时,右上角的胶囊(MenuButton)在不同机型测试,会发现很难适配。实测中不同的手机,胶囊高度不一样、状态栏高度不一样。与模拟器显示的情况是不一样的。完全需要根据手机,动态的计算高度。先看一些小程序顶部导航栏适配的情况图一某团图二某乎图三某东图四某拉上图适配做的最好的是某东,...

2021-06-19 210 0 0 阅读全文

Elementui的El-Popover修改样式不生效的解决

el-popover如何修改样式?在使用element-ui的时候,有一个常用的组件,那就是el-popover,但是element-ui官方文档中样式跟用法都比较局限,在使用时都需要改动样式但是问题来了,今天同事改着改着突然发现添加的层叠样式并不生效,只有添加内联样式才能生效,不应该呀?!且看了d...

2021-07-01 220 0 0 阅读全文

H5直播Video标签坑汇总

video标签详解{//ios需要静音才能同时播放多个video,默认静音播放,在3s后关闭静音if(iphone){setTimeout(()=>{constvideoElement=this.videoRef.currentvideoElement&&(videoEleme...

2021-07-14 216 0 0 阅读全文

H5直播入门(理论篇)

这篇总结其实是去年公司每周技术分享会轮到我的时候写的。那时候公司正在大刀阔斧地准备直播业务,私以为主管会委以重任,就翻了不少论坛,做了一次简单的技术分享。后来直播业务让另一位同事承担了,自己也就没了实践直播的机会,有点可惜吧。好了,废话不多说,开始我们的理论篇~技术背景可以看到,直播从PC到一直发展...

2021-07-14 340 0 0 阅读全文

H5实现手机拍照和选择上传

1.html/js代码:/**拍照*@param{Object}c*@param{Object}d*/varupload=function(c,d){"usestrict";var$c=document.querySelector(c),$d=document.querySele...

2021-07-06 146 0 0 阅读全文

分析对比华为虚拟化CSS与H3C虚拟化IRF2技术

华为CSS与H3CIRF2技术对比一、华为CSS技术介绍CSS是ClusterSwitchSystem的简称,又被称为集群交换机系统(简称为CSS或集群)。是将几台交换机通过专用的集群线缆链接起来,对外呈现为一台逻辑交换机。在S9300/S7700(S9700暂无CSS集群卡)交换机主控板(SRU)...

2021-08-17 194 0 0 阅读全文

微信小程序 获取用户信息并保存登录状态

、微信小程序的运行环境不是在浏览器下运行的。所以不能以cookie来维护登录态。下面我就来说说我根据官方给出的方法来写出的维护登录态的方法吧。一、登录态维护官方的文档地址:https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-login.html#wxl...

2021-06-19 190 0 0 阅读全文

HTML Clearfix清除浮动讲解

一、浮动的概念浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止。由于浮动框不在文档的普通流中,所以文档的普通流中的块框表现得就像浮动框不存在一样。二、浮动的影响1.浮动会导致父元素高度坍塌父元素中有子元素,并且父元素没有设置高度,子元素在父元素中浮动,结果必然是父元素的高...

2021-08-16 194 0 0 阅读全文

基于LayPage分页插件浅析两种分页方式

最近在开发过程中经常用到分页,今天挤出些时间来捋一捋自己的经验在web开发中,一般显示数据列表页时,我们会用到分页控件来显示数据。采用分页一般基于两种不同的需求,一种是数据量不算很大,但是在页面展示又显得过长,看起来很不舒服。一种则是因为数据量太过于庞大,无法一次性去数据库将数据读取出来,于是采用分...

2021-06-19 113 0 0 阅读全文

Bootstrap5的断点与容器的具体使用

1、Bootstrap5的断点1.1移动优先说到移动优先,先要提一下响应式设计,响应式界面就是设计一个页面能够适应不同的设备,响应式设计利用媒体查询等技术实现不同设备/窗口下的样式适配,也就是说它会根据你使用的不同设备展示不同的页面排版给用户。这个实现起来就是根据html5有个媒体查询技术,可以获取...

2021-07-06 170 0 0 阅读全文

不要在HTML中滥用Div

概述做前端开发的同学都知道,一个网页的基本组成部分是HTML,JavaScript和CSS。开发人员通常更关注JavaScript和CSS,实践着各种语言规范和设计模式。对于HTML的关注度则明显偏少,只要能做出设计师画的界面就万事大吉了,不怎么去关心HTML是不是规范合理。于是下面的情况随处可见:...

2021-05-08 182 0 0 阅读全文

Bootstrap网页布局网格的实现

1、Bootstrap网格系统的工作原理1.1十二栅格系统栅格就是网格,英文Grid,之所以有的地方是网格,有的地方是栅格,只是翻译习惯不同。十二栅格系统的意思是将整个屏幕按宽度划分为十二等份,而一等分代表屏幕宽度的十二分之一,为什么划分为十二等份,而不是十等分或其他等份呢,这是因为12是1,2,3...

2021-07-06 163 0 0 阅读全文

带你了解CSS基础知识,样式

什么是CSSCSS(CascadingStyleSheet):层叠样式表语言。CSS的作用是:修饰HTML页面,设置HTML页面中的某些元素的样式,让HTML页面更好看。在HTML页面中嵌套使用CSS的三种方式第一种方式:在标签内部使用style属性来设置元素的CSS样式,这种方式称为内联定义方式。...

2021-07-12 187 0 0 阅读全文

微信小程序日历

项目需要一个日历功能,花了一天时间实现的微信小程序日历,js大小只有几k,引入了bootstrap字体图标(文件icon.wxss,该字体已经bootstrap字体图标需要的字体)看起来有80k,出去icon.wxss整个只有几k,有问题欢迎指正如图:index.wxml{{currentDate}...

2021-06-19 129 0 0 阅读全文

根据地理位置获取经纬度

这个功能还是比较实用的,记录分享一下:根据地址查询经纬度要查询的地址:查询结果(经纬度):varmap=newBMap.Map("container");map.centerAndZoom("郑州",15);map.enableScrollWheelZoom(...

2021-06-19 120 0 0 阅读全文