
HTML
S筱潇S四维Smile
代码搬运工~前端engineer
展开
-
富文本中去掉 HTML 和 CSS 样式,只保留纯文本
要从富文本中去掉 HTML 和 CSS 样式,只保留纯文本,可以使用以下几种方法:1. 纯 JavaScript 方法你可以使用 JavaScript 的innerText或来提取文本,而忽略 HTML 标签和样式。原创 2024-09-11 10:49:17 · 941 阅读 · 0 评论 -
iview 使用Form表单,Input使用Enter回车页面刷新问题
禁止触发form表单的submit事件。在form表单标签加上。原创 2023-05-11 10:11:00 · 941 阅读 · 1 评论 -
input 限制只能输入数字,且保留小数后两位
【代码】input 限制只能输入数字,且保留小数后两位。原创 2023-02-07 10:50:25 · 1536 阅读 · 0 评论 -
el-cascader级联选择器清空初始化方法
<el-cascader class="w500" ref="cascader" :options="options" :props="props" @change="cascaderChanged"></el-cascader>this.$refs.cascader.$refs.panel.checkedValue = []; // 清空选中值this.$refs.casc..原创 2022-04-28 17:31:38 · 2185 阅读 · 1 评论 -
iView UI 使用page分页添加跳转按钮-输入页码后点击跳转
使用电梯,快速跳转到某一页在iview里,分页组件的电梯功能输入页码后需要按回车才能跳转这让不知道需要按回车的人摸不着头脑呀,所以呢,动动手写个跳转按钮~<div class="overflow-h mt10"> <span class="fr mt5 ml10"> <Button class="btn-page mr10" type="primary" size="small" @click="goElevat原创 2022-04-08 15:52:40 · 733 阅读 · 1 评论 -
css如何改变横线<hr/>标签的颜色
<hr style='background-color:blue; height:1px; border:none;''/>hr标签是线条,其颜色要用background-color;再给线条设置一个height,正常粗细就是1px,设置完后线条变粗;那是因为hr有默认的border,需要将它的边框去掉,设为border:none以上三点缺一不可...原创 2022-03-17 16:56:39 · 2580 阅读 · 0 评论 -
ElementUI自定义主题颜色
在项目中改变 SCSS 变量Element 的 theme-chalk 使用 SCSS 编写,如果你的项目也使用了 SCSS,那么可以直接在项目中改变 Element 的样式变量。新建一个样式文件,例如 element-variables.scss,写入以下内容:/* 改变主题色变量 */$--color-primary: #1aa;/* 改变 icon 字体路径变量,必需 */$--font-path: '~element-ui/lib/theme-chalk/fonts';@impo原创 2022-02-09 14:56:50 · 438 阅读 · 0 评论 -
H5中 video 使用border-radius失效解决方法
添加css即可,亲测有效-webkit-backface-visibility: hidden;-webkit-transform: translate3d(0, 0, 0);原创 2021-07-26 17:38:32 · 2277 阅读 · 1 评论 -
html2canvas在iphone7 iphonex都生成不了
打开package.json看一下html2canvas的版本,只有1.0.0-rc.4这个版本是可行的,如果你指定下载这个版本在package.它是指1.0.0-rc.4以上的版本,把^去掉再npm install就可以了原创 2021-04-27 11:53:13 · 540 阅读 · 0 评论 -
H5中 时间格式NAN-NAN-NAN
js的日期对象可以识别的日期字符串有四种:1.YYYY-MM-DD 2019-11-11 01:01:012.MM-DD-YYYY 11-11-2019 01:01:013.YYYY/MM/DD 2019/11/11 01:01:014.MM/DD/YYYY 11/11/2019 01:01:01标准浏览器都是支持这四种时间格式的,但是ie不识别第一种“-”链接,故采用 var strDate ="2019-11-11 01:01:01";varTime =newDat...原创 2021-04-26 16:14:53 · 699 阅读 · 0 评论 -
移动端h5 隐藏滑动滚动条
使用一下样式即可: ::-webkit-scrollbar { width: 0px; }原创 2021-04-09 17:20:23 · 993 阅读 · 1 评论 -
html5 移动端 Android和iOS手机 video自动播放
<video webkit-playsinline playsinline x5-playsinline="" x-webkit-airplay="allow"id="video" controls="controls" src="xxx.mp4" autoplay="autoplay"></video>1 、iOS方法:引入jweixin-1.6.0.js <script src="http://res.wx.qq.com/open/js/jweixin-1..原创 2021-03-09 17:50:07 · 1347 阅读 · 0 评论 -
input 限制只能输入数字,且保留小数后两位
<input @keyup="value=oninput(value)" @change="value=oninput(value)"/>js方法oninput(num) { console.log(num) var str = num var len1 = str.substr(0, 1) var len2 = str.substr(1, 1) var lenLa.原创 2021-02-22 14:58:03 · 1522 阅读 · 0 评论 -
微信浏览器如何禁止iPhone手机上下滑动网页
在index.html添加阻止默认事件document.body.addEventListener("touchmove", function(event) { event.preventDefault(); });原创 2021-01-26 20:36:01 · 401 阅读 · 0 评论 -
wangEditor关闭粘贴样式的过滤,解决小程序中xml溢出报错问题
从别的网页上复制文本,粘贴到wangEditor富文本编辑器中,因为wangEditor自带粘贴样式过滤,粘贴过来的样式会被编辑器过滤掉,文章中有很多xml的标签,小程序解析时就会出现报错。解决办法:在编辑器中加上参数pasteFilterStyle:var E = window.wangEditorvar editor = new E('#div1')// 关闭粘贴样式的过滤...原创 2020-03-20 11:48:25 · 2007 阅读 · 0 评论 -
input 禁止输入特殊字符
转自:https://blog.youkuaiyun.com/u010982856/article/details/52297232有些特殊字符传入到后台是会产生错误的 有可能会sql注入,所以从根本上拦截研究了一下有几种方式:方式一:拿到value值以后 在你传递之前处理 function stripscript(value) { var pattern = new RegEx...原创 2020-03-11 22:54:25 · 1471 阅读 · 0 评论 -
Vue自定义指令—— 完美解决H5页面不同尺寸屏幕的适配问题
H5适配一直是一个头疼的问题,基于vue框架针对H5在不同分辨率的手机做出来一套适配方案,具体如下:设计图按iPhone6/7/8 去掉底部返回条的尺寸设计的: width:750px , height:1108px(可使用该方法应对其他设计图尺寸)一、以设计图的尺寸为标注的做一套适配方案,就是出完美高度比:function getResheightAndWidth() { ...原创 2020-01-17 16:09:15 · 2140 阅读 · 0 评论 -
div盒子水平垂直居中的方法
一、盒子没有固定的宽和高方案1、Transforms 变形这是最简单的方法,不仅能实现绝对居中同样的效果,也支持联合可变高度方式使用。内容块定义transform: translate(-50%,-50%) 必须加上top: 50%; left: 50%;优点:1.内容可变高度2.代码量少缺点:1.IE8不支持2....原创 2019-12-13 18:07:46 · 262 阅读 · 0 评论 -
input file控件使用accept过滤 限制的文件类型
在文件上传控件(input type='file')中,可以通过accept属性实现对文件类型的过滤。一、相关代码: 下面给出对应的文件上传控件代码:<input type="file" id="myFile" accept="image/jpeg,image/gif,application/msword"/><br/> 上面的代码表示限制文件上传...原创 2019-01-14 17:01:06 · 6589 阅读 · 0 评论 -
HTML/CSS 面试总结
1、什么是盒子模型?在网页中,一个元素占有空间的大小由几个部分构成,其中包括元素的内容(content),元素的内边距(padding),元素的边框(border),元素的外边距(margin)四个部分。这四个部分占有的空间中,有的部分可以显示相应的内容,而有的部分只用来分隔相邻的区域或区域。4个部分一起构成了css中元素的盒模型。2、行内元素有哪些?块级元素有哪些? 空(void)元素有...原创 2019-01-14 17:31:30 · 189 阅读 · 0 评论 -
降低PNG图片存储大小方法、图片压缩方法
1. 将PNG图片用PS打开。2. 图像-模式-8位/通道 (这样在后续存储时才有gif存储选项)3. 将图片另存为GIF。 4. 选项中选择局部可感知或者全部可感知。5. 强制选择“无”,勾选透明度。6. 存储后的gif文件和原png文件对比,从20.6k变为了1.8k。7. 最后,把文件后缀的gif命名为png。这样,既保证了分辨率、大小,又...转载 2019-02-12 17:09:40 · 1126 阅读 · 0 评论 -
input type=date 移动端显示placeholder失效问题
1.html :监听input失去焦点和获取焦点的事件<input type="date" id="date" v-model="birthday" placeholder="出生年月日" @blur="inputBlur($event)" @focus="inputFocus($event)" />2.css:用伪类去为input模拟一个pl原创 2019-03-04 10:43:57 · 1710 阅读 · 0 评论 -
纯CSS3实现流星划过动画
1.html :创建几个流星<div class="meteor-body"> <div class="main-con"> <div class="shooting_star"></div> <div class="shooting_star"></div&a原创 2019-03-18 15:05:21 · 3849 阅读 · 0 评论 -
input 限制只能输入英文、中文、字母、小数、表情包等约束
输入大小写字母、数字、下划线:<input type="text" οnkeyup="this.value=this.value.replace(/[^\w_]/g,'');"> 输入小写字母、数字、下划线:<input type="text" οnkeyup="this.value=this.value.replace(/[^a-z0-9_]/g,'');">...原创 2019-08-12 23:27:50 · 4280 阅读 · 0 评论 -
MAC 打开safari和Chrome打开开发者工具的快捷键
mac下safari和chrome打开开发者工具的快捷键相同,都是option(alt)+command+i原创 2019-09-21 14:06:15 · 1206 阅读 · 0 评论 -
Html5 h5页面输入框失去焦点页面底部白板问题
H5网页中,用户输入完成后关闭输入框后底部会出现白条,如下图:解决方案:在输入框失去焦点的时候,设置窗口页面滚动至0即可:$(window).scrollTop(0,0);vue项目中的实例:<template> <div class="item"> <input type="text" @blur="blurFoucus()"...原创 2019-01-17 18:28:23 · 1483 阅读 · 0 评论