自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

Clara_G的博客

学习使人快乐

  • 博客(30)
  • 资源 (1)
  • 收藏
  • 关注

原创 门户网站在手机上htmlbody宽度没有完全填充解决办法

不要求移动端样式适配,仅需要整个网站缩小至手机屏不变形,应该怎么设置字号等?开始同事写的门户网站,在手机上顶部banner展示不全,在右侧空了一片。1、html、body宽度是否设置为100%?2、内部元素是否存在高度塌陷况?

2023-05-16 11:45:26 466

原创 杂记:界面统一变灰

因为2020年4月4号的特殊需求,网站需要进行全部变灰显示,以下代码可在多数浏览器试用滤镜 :filterhtml{ -webkit-filter:grayscale(100%); filter:grayscale(100%);}ie暂时没有解决方案,尝试了下ie滤镜,没实现相应效果,欢迎大家在评论区交流...

2020-04-07 10:50:17 355

原创 js判断数据类型常用的6种方法

js判断数据类型常用的方法,不论在开发中开始在面试中,都是经常遇到的问题,尤其是在面试时,当面试官问及js判断数据类型的方法时,回答的越多,说明掌握的广度跟深度越多,感觉自己逼格也越高.废话不多说了,进入正题常见的判断js数据类型的方法有如下几种1.最常见的判断方法:typeof2.已知对象类型: instanceof3.对象原型链判断方法: prototype通用但很繁琐...

2020-03-10 11:29:56 28972 8

原创 js置空html界面中的title标签

上代码,亲测有效document.title='\u200E';document.title=' ',这个方法我试过不可以.效果图如下:但是,在右键检查网页源代码时,title中还是有内容的,截图如下:笔者这边还是会出现闪动一下才清空,在手机浏览器跟app上的h5界面都这样子,如有更好的方法欢迎交流参考文章:https://www.jianshu.com/...

2020-03-03 11:27:39 763

原创 解决ios中的onclick失效的问题

前段时间笔者跟同事一起开发移动端H5界面,后来在测试时,发现一些界面的onclick事件在苹果ios上不管用,因为笔者跟同事之前一直做PC端开发,不太清楚怎么回事,于是在网上找到如下几种方案:一.修改css方法将绑定事件的span元素添加 z-index 跟cursor:pointer,这个没管用二.修改onclick的绑定直接把onclick事件换成$('span').on...

2020-02-28 09:50:06 2976

原创 css3+svg(兼容ie低版本)实现文字渐变的方法

一、css3实现文字渐变(不兼容ie低版本)p{ font-size: 26px; background: linear-gradient(to right,#63bd78,#36a28e,#1e8fab,#047bcb); -webkit-background-clip: text; color: transparent;}加上底部渐变横线代码如...

2020-01-14 14:55:45 1531 2

原创 移动端H5界面 前端html app 自动清除引入的css js缓存方法

笔者近期在开发移动端h5界面,发现每次改完样式 js都需要强制清除下手机浏览器的缓存,才显示效果,但是通过微信浏览器进行查看时没找到清除缓存的按钮,于是乎,自己上网上找了写方法,又在学习群里交流了下,总结出以下方法1.添加版本号或者标识号在引用的css 跟js 后面,添加一个版本号,至于怎么使用规则,可以跟组内小伙伴约定好,这样子升级到正式环境的时候,就不用用户自己清理缓存了.(原理:增加...

2020-01-13 16:38:26 2846 1

原创 eclipse中出现 svn: Unreadable path encountered; access denied 的处理方式

今天笔者在使用eclipse中的svn更新代码的时候,发生了如下错误svn: Unreadable path encountered; access denied在网上找了一堆资料没解决,最终排查原因是我早上进行了tomcat的jvm调优,不然内存不够老是报错,修改了window-preference-java-install JRES--edit--Default VM a...

2019-09-03 10:44:10 605

原创 带有图片的的列表实现自适应的方案

自适应是个很长久的话题,尤其是在做PC端界面时,考虑到自适应的过程,图片也不能定高宽.现在来讲一下.一般图片我们用一个div来当容器.里面放置我们要设置的来自服务器或者本地的静态资源图片.结构一般如下所示:<div class="imgContainer"> <img src="images/a.jpg"/></div>这时候有两种方案来...

2019-08-07 11:07:19 830

原创 js实现判断字符串中是否出现重复字符,如果有,输出第一个重复字符的位置,如果没有,返回-1(注,时间复杂度越低越好,不要使用indexof 和正则表达式)--前端笔试题(大搜车)

最近做过一道笔试题js实现判断字符串中是否出现重复字符,如果有,输出第一个重复字符的位置,如果没有,返回-1(注,时间复杂度越低越好,不要使用indexof 和正则表达式)回来上网查资料,很多都是用indexof 和正则实现的,后来问了几位好友,现将整理的结果如下思路一:代码如下//先转化成对象,把单个字符为属性,出现次数为值let str = 'tbolbdkkeslgadg...

2019-08-07 10:46:00 2402

原创 解决给li添加border兄弟元素浮动的问题(添加border不浮动的方法)

最近笔者在写界面时遇到一个问题,给li添加border边框选中效果的时候,发现它的兄弟元素一直抖动.发现时浏览器的盒模式计算增加了元素的width找了很多资料,说是给li元素添加box-sizing属性,结果还是不行box-sizing属性是css3为了改善盒模型定义的,该属性能事先定义盒模式的尺寸解析方式,box-sizing:content-box|border-box|i...

2019-05-13 10:14:23 1471 1

原创 使用vue时报错 Cannot read property xxxx ----对Vue中$nextTick的理解和应用(异步更新队列机制)

设想一个场景,使用v-if实现div的隐藏和显示,并且在显示时获取div里面的内容,div默认不显示,代码如下:html: <div id="app"> <div id="demo" v-if="showDemo">这是一段文本</div> <button @click="getText"&...

2019-05-07 11:30:26 1555

原创 vue.js实战实现购物车的单选全选和二维数组分类--第五章购物车练习(二)

本例介绍《vue.js实战》第五章最后的购物车练习二,练习2:将商品列表list改为一个二维数组来实现商品的分类,比如分为"电子产品","生活用品","果蔬",同类商品聚合在一起.提示,你可能用到两次v-for.提醒:二维数组可以采用这种方式[ { name:'电子产品', productList:[ { id:1, name:'...

2019-05-05 10:31:12 1852 3

原创 vue.js实战实现购物车的单选全选--第五章购物车练习(一)

本例介绍《vue.js实战》第五章最后的购物车练习一,练习1:在当前示例基础上扩展商品列表,新增一项是否选中该商品的功能,总价变为只选中商品的总价,同时提供一个全选按钮截图如下:html: <div id="app" v-cloak> <template v-if="list.length"> <table> ...

2019-05-05 10:20:20 3797 4

原创 css实现文章首字下沉显示

要向实现下图文章首字下沉的效果,需要使用css3中的:first-letter属性代码如下:css代码: .first::first-letter { font-size: 50px; float: left; color: #333; text-indent: 0; padding: 2px;...

2019-04-26 17:29:56 2601

原创 媒体查询在iPhone iPod touch中使用safari浏览器失效的原因

在iphone和ipod touch中使用的Safari浏览器会出现媒体查询失效这是为什么呢这是因为在iphone中使用Safari浏览器在进行页面显示时,将窗口宽度当做980px像素进行显示。所以即使在界面中已经写好了页面在小尺寸窗口中运行时的样式,iphone中的Safari浏览器也不会使用这个样式,而是选择窗户宽度为980px时所使用的样式。在这种情况下,可以使用<meta>...

2019-04-26 14:21:20 1030

转载 @media screen and 不起作用原因汇总。(转载)

@media screen and 不起作用原因汇总。首先确认是不是css本身的问题,而不是媒体查询没有生效;例如div{display:flex;}/*那么div所有的display效果都将无法生效*/第一种错误:格式书写错误and后面必须有空格例如下面代码;@media screen and (max-width:500px){ }第二种错误:样式冲突;@m...

2019-04-26 12:04:24 2517

原创 label 标签的for的作用和构建表单结构时改善用户体验的建议

一般我们在构建表单的时候,会用到label标签,label标签页通常是下面两种用法:1.for绑定的时name属性里面的值,<div class="form-group"> <label for="name">用户名:</label> <input type="text" id="userName" name="name"/>&...

2019-04-16 14:34:30 560

原创 js实现检测浏览器音频和视频格式的支持情况

要使用JavaScript检测浏览器支持哪些音频格式可使用下面代码,使用audio元素的canPlayType方法该方法粗涂鸦板MIME类型与编码/解码器参数,并返回下列三个字符串之一:1.probably,2.maybe,3.空字符串function checkAudio() { var myAudio = document.createElement('audio'); ...

2019-04-01 17:27:13 2392

原创 Canvas学习和基本属性介绍以及判断浏览器是否支持canvas

一、 创建canvas元素如果要向界面中添加canvas元素,可以使用以下代码<canvas id="myCanvas" style="border:1px solid;" width="300" height="150"></canvas> <script> var c = document.getElementById("myCan...

2019-04-01 16:11:11 593

原创 ie8及以下浏览器使用HTML5新标签

由于有些浏览器并不支持HTML5中新增的元素(header,footer, section,article,nav等),如早期的IE8或更早版本。为了让其支持新增的HTML5元素,可以使用document.createElement 的方法思路:先判断浏览器--ie8及以下使用该方法创建元素 var DEFAULT_VERSION = 8.0; var ua = navigat...

2019-03-21 17:37:34 178

原创 input框取消自动回填账号密码等信息的解决方法

最近在开发注册界面的时候,发现了一个问题,chorme浏览器中账号和密码老是回填到input框中(浏览器保存的用户名和密码自动填充).刚开始给input框添加autocomplete="off",没管用给form 加这个也没管用最终通过这个方法解决的阻止浏览器自动回填表单功能&lt;form role="form" autocomplete="off"&gt; &l...

2019-03-04 14:21:46 6376 2

原创 前端js实现上传图片大于2M时压缩,预览

最近有个需求,用户在上传图片预览时,需要显示大小为2M一下,大于2M的需要压缩后上传,小于2M的原图显示一.先说下限制图片大小的好处直接上传特别占用带宽,上传速度慢,对程序考验以及影响用户的体验 图片资源直接上传,占用的服务器空间过大,容易造成空间浪费二.实现思路只要是借用canvas和FileReader函数,以下是代码,其中添加了需求,大于2M的图片才进行压缩,小于的原图显示...

2019-02-26 16:30:37 11303 2

原创 前端中的hack是什么意思?常见的hack技术以及以及hack技术的利弊

前端中的hack,很多人的回答如下:由于不同的浏览器,比如Internet Explorer 6,Internet Explorer 7,Mozilla Firefox等,对CSS的解析认识不一样,因此会导致生成的页面效果不一样,得不到我们所需要的页面效果。这个时候我们就需要针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览器,能在不同的浏览器中也能得到我们想要的页面效果总之....

2019-02-20 17:53:23 10821 1

原创 微信小程序百度地图报错:APP Referer校验失败

今天用自己编写的小程序时发现,地图一直在拼命加载中,然后看了下代码,报错如下app referer校验失败于是找到上网找到两种解决方法1.更改百度地图白名单内容为*2.查看自己授权的小程序appId是否发生改变如果有其他的方法,欢迎大家留言,一起交流...

2019-01-09 12:08:15 8575 4

原创 iframe根据子界面高度自适应的情况--子界面table异步

iframe根据子界面高度自适应的情况--子界面table异步最近笔者遇到一个问题,需要在后台管理系统界面中右侧区域iframe根据子界面的高度进行自适应.开始用的方法是这样的&amp;lt;iframe scrolling=&quot;no&quot; frameborder=&quot;0&quot; name=&quot;mainFrame&quot; id=&quot;mainFrame&quot; src=&quo

2018-10-23 12:13:56 572

原创 css样式编码规范

css样式编码规范通常大家在进行css编码时,都是想到什么写什么,尤其是命名的时候,更是千变万化.笔者最近在项目中和同事共同编写css时遇到一些坑.css的规范在团队配合和多人协作的情况下显得尤为重要.本文只是个人体会,希望大家多多提意见,共同完善css的编码规范.编码设置通常我们采用utf-8的编码规范,在css文件的头部使用 @charset “utf-8” 注意 @ch...

2018-02-24 17:02:28 566 1

转载 浅谈webpack

浅谈webpack入门学习本文主要介绍webpack入门以及笔者对webpack的一些理解:一.为什么要使用webpack现在的前端界面具有丰富的JavaScript代码和很多依赖包,为了简化开发的复杂度,通常采用以下思路:模块化开发,把复杂的程序细分成小的模块类似于TypeScript这种在JavaScript基础上拓展的开发语言,我们采取将其转化为JavaScript文...

2018-02-24 14:34:33 645

原创 Windows 下 MongoDB的安装,配置,删除以及RoboMongo(Robo 3T)的安装和使用教程

Mongodb安装教程一.下载1.1  mongodb下载Mongodb下载地址: https://www.mongodb.com/download-center?jmp=nav#community默认下载msi安装版的,可以点击zip下载免安装版.community是社区版.注意,选择和自己电脑位数匹配的安装包.笔者电脑是64位的.这里选择的是64位安装包.1

2017-08-29 14:48:40 7888 5

原创 win10恢复误删的原生应用(以应用商店为例)

1、点击开始菜单,按下空格键,在搜索框输入“powershell”,右键以管理员身份运行Windows Powershell组件。2、输入命令“Get-AppxPackage -allusers | Select Name, PackageFullName”,获取当前系统安装的所有应用3、在列表中找到名称为“Microsoft.WindowsStore”(即应用商店)的应用,然后复制右侧对应的包名称

2017-08-21 17:09:51 8264 5

css实现原型进度条效果

通过css实现环状圆形进度条,可以用于统计分析中的圆形进度

2018-11-28

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除