css样式之input输入框默认样式
帮朋友写个简单的课程设计,后面会贴出来,项目刚开始就遇到一个坑(给input输入框设定样式,但是,点击后会出现蓝色边框),之前写其他的项目时也遇到过,百度一下资料解决了,现在又碰到了,写一下,留着备用(代码和效果图就就不粘出来了)。
查资料后才知道html的许多标签都有一些默认的属性,这次遇到的是input标签的默认属性(点击输入框时会出现 "蓝色边框" )。话不多说,解决方法如下:
一、直接给input标签加一个online:none的样式
<style>
input {
outline:none;
}
</style>
二、直接控制input标签聚焦是不出现默认边框(原文链接:https://blog.csdn.net/yike_dc/article/details/76928479)
<style>
input:focus{ outline:none; }
</style>
css样式之input输入框默认样式的更多相关文章
- Chrome中输入框默认样式移除
Chrome中输入框默认样式移除 在chrome浏览器中会默认给页面上的输入框如input.textarea等渲染浏览器自带的边框效果 IE8中效果如下: Chrome中效果如下: 这在我们未给输 ...
- css去除webkit内核的默认样式
做移动端的朋友应该知道,iphone的默认按钮是个很恶心的圆角,select下拉框也有默认样式无法修改. 这时候可以用到 -webkit-appearance:none //去除默认样 在按钮和sel ...
- 修改input输入框的样式
直接上代码 <style> .input{ -web-kit-appearance:none; -moz-appearance: none; font-size:1.4em; height ...
- html5中如何更改、去掉input type默认样式
1.如何去掉input type=date 默认样式 HTML代码: 选择日期:<input type="date" value="2017-06-01" ...
- css修改select下拉列表的默认样式
select的一些默认样式我们很难修改,比如图标的替换.接下来就说说如何修改这些默认样式: html代码: <div> <select name=""> & ...
- CSS消除button标签的默认样式
button{ /*消除button的默认样式*/ /*这种写法是对所有的button标签同时生效*/ margin: 0px; padding: 0px; /*自定义边框*/ border: 0px ...
- (谷歌浏览器等)解决css中点击input输入框时出现外边框方法【outline:medium;】
问题:在使用谷歌浏览器,360浏览器时,点击input输入框会出现带颜色的外边框,如下图所示:
- Chrome 下input的默认样式
一.去除默认边框以及padding border: none;padding:0 二.去除聚焦蓝色边框 outline: none; 三.form表单自动填充变色 1.给input设置内置阴影,至少要 ...
- 去除input的默认样式
input, button, select, textarea { outline: none; -webkit-appearance: none; border-radius: 0; } outli ...
随机推荐
- ES6系列之let/const及块级作用域
本系列是在平时阅读.学习.实际项目中有关于es6中的新特性.用发的简单总结,目的是记录以备日后温习:本系列预计包含let/const.箭头函数.解构.常用新增方法.Symbol.Set&Map ...
- 2018-2019-2 20165312《网络攻防技术》Exp6 信息搜集与漏洞扫描
2018-2019-2 20165312<网络攻防技术>Exp6 信息搜集与漏洞扫描 目录 一.信息搜集技术与隐私保护--知识点总结 二.实验步骤 各种搜索技巧的应用 Google Hac ...
- 刘志梅201771010115.《面向对象程序设计(java)》第十五周学习总结
实验十五 GUI编程练习与应用程序部署 实验时间 2018-12-6 1.实验目的与要求 (1)一个JAR文件既可以包含类文件,也可以包含诸如图像和声音这些其他类型的文件. 创建一个新的JAR文件应 ...
- YAML快速入门
https://www.jianshu.com/p/97222440cd08 我们学习Java,都是先介绍properties文件,使用properties文件配合Properties对象能够很方便的 ...
- (详细)华为荣耀8X JSN-AL00的usb调试模式在哪里开启的教程
经常我们使用Pc链接安卓手机的时候,如果手机没有开启usb开发者调试模式,Pc则没办法成功识别我们的手机,有时候,我们使用的一些功能比较强的的工具比如之前我们使用的一个工具引号精灵,老版本就需要开启u ...
- debian apache2 多端口对应多文件 虚拟端口配置
apache2单IP多端口创建虚拟站点如下: 1.转到配制目录虚拟站点配制目录 cd /etc/apache2/ 2.配置新增多的端口 编辑上级目录中的端口配制文件sudo gedit ports ...
- 微信公众号openid处理的一些笔记
每个用户对每个公众号的OpenID是唯一的.对于不同公众号,同一用户的openid不同.如果公司有多个公众号,可以通过开放平台关联,这样同一用户,对同一个微信开放平台下的不同应用,unionid是相同 ...
- 域名动态解析到动态IP
一般宽带用户的IP都是动态IP,重连之后IP可能会发生变化. 如果想在其他地方连接家里的设备,或者在家中搭建服务器,就会受到影响. 现在提供一种动态解析域名的方式,只要检测到IP的变化,那么就调用阿里 ...
- Android开发 MVP模式的规范记录(个人总结)
前言 首先,这篇文章不在讲解什么是mvp模式,如果需要请自行搜索mvp模式文章了解.这个文章里我只记录mvp模式的创建和mvp各自层的界限.另外这个博客属于个人使用mvp模式后一些经验总结与记录.并不 ...
- Linux java进程无故被kill
这两天,演示环境的java应用无端端就被停止了.在这里记录一下原因和排查过程: 发现应用挂掉以后,第一时间登陆centos,发现进程没有了.于是重新启动应用. 但是启动不起来,去看业务日志,没有找到任 ...