css 图片和多行文字对齐
图片和单行文字对齐比较简单,在图片和文字(行内元素)上加 vertical-align: middle;。图片与多行文字对齐的解决方法,就是将多行包装成单行,单行内再用 <br/> 进行换行。以下我调试过的一个版本:<style> img { vertical-align: middle; } p { display: inline-block; v
图片和单行文字对齐比较简单,在图片和文字(行内元素)上加 vertical-align: middle;。图片与多行文字对齐的解决方法,就是将多行包装成单行,单行内再用 <br/> 进行换行。以下我调试过的一个版本:<style> img { vertical-align: middle; } p { display: inline-block; v
给公司网站做了新页面,然后手就闲不住的这边点点,那边点点。发现图片总是被拖着走,就好烦。想着有没有可以禁止图片被拖拽的方法,然后找到了一个比较简便的方法:<img src="xxx" alt="xxx" draggable="false"/>给需要禁止拖动的图片添加拖动属性,设置值为 false 即可。如果是对整个页面上的图片
需求说明需要在鼠标悬停(hover)在一个元素上时,显示隐藏的 div。使用场景:PC 端 hover 一个按钮,展示隐藏的二维码,如微信公众号,App 下载等。实现过程当然可以直接用 jQuery 的 hover() 事件,直接绑定或者使用 onmouseover 和 onmouseout 绑定回调函数。然后在回调函数中隐藏或显示目标元素。CSS 也有这样一种用法,a:hover b {},但我
问题说明input 标签中的 reset 按钮有重置表单的效果,比如,将 text、password textarea 用户输入的内容清空,将单选、多选等恢复默认选择状态等。一般的表单提交不会用到 reset 按钮,要么提交,要么取消。最近有一需求,需要表单中存在重置按钮。但点击 reset 按钮,表单并没有被重置。原因分析网上找到了 reset 不能清空的原因:reset 重置是将表单中的元素标
问题描述页面添加一个返回顶部的按钮(fixed),并监控窗口的 scroll 滚动事件。当 scrollTop(滚动条距离顶部的距离,及文档滚动距离)在一定范围内(比如视窗高度)隐藏返回顶部按钮;当 scrollTop 超过一定高度,则显示返回顶部按钮。具体 demo<div id="back-to-top"> <img src="./ima
之前做过一些案例,将 div 展示到文档的中间,一般会考虑用 margin: 0 auto; 或者 text-align: center;。如何将一个 div 绝对定位到页面正中间呢?这个功能需求主要应用在一些弹框或者提示信息展示上。网络上找到一个合适的(也是用 margin 来实现):.fixed-div { width: 300px; height: 150px; bo
IOS 让人很郁闷的一点就是,经常会出现样式不一致的情况。一开始没怎么注意,后来修改登录、注册页面发现,新写的按钮样式什么的都变了,本来是浅蓝色,变成了类似 #467B96 的浅绿色,橙黄色变的蜡黄色,莫名其妙。今天发现新写的页面也是这样色的,突然就忍不了,百度找了一下对策。解决方法:input,select,button{ -webkit-appearance:none; appeara
更新内容有网友说是微信内置浏览器的问题,而并非系统之过。用我自己的 IOS 13.6 系统版本的苹果手机测试了一下,并不准确。浏览器自动填充次数 微信内置浏览器2 Safari1 QQ 浏览器2 搜狗浏览器2 Chrome2 另外,由于获取验证码页面在授权登录(这里用的 QQ 授权)之后,UC 和 夸克因为众所周知的原因,无法调起 QQ 授权登录,测试不了;Firefox(火狐)调起后,返回参数错
兼容性placeholder 属性是 css3 中新增加的属性,IE9 和 Opera12 以下版本的 CSS 选择器均不支持占位文本。修改 placeholder 默认的字体、颜色和大小方式 1:因为每个浏览器的 CSS 选择器都有所差异,所以需要针对每个浏览器做单独的设定(可以在冒号前面写 input 和 textarea)。::-webkit-input-placeholder { /* W
swiper 作为一滑动插件非常好用,但 swiper 存在一些限制。比如我这次遇到的 swiper 内部元素显示受到 .swiper-container 样式 overflow:hidden 限制,具体例子就是提示框。当用户 hover 到某个元素上,需要展示出提示框。但因为 overflow:hidden 的限制,超出外部 div 层的部分都被隐藏了。swiper 使用方法我使用的版本是 sw