帮朋友写个简单的课程设计,后面会贴出来,项目刚开始就遇到一个坑(给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输入框默认样式的更多相关文章

  1. Chrome中输入框默认样式移除

    Chrome中输入框默认样式移除 在chrome浏览器中会默认给页面上的输入框如input.textarea等渲染浏览器自带的边框效果 IE8中效果如下: Chrome中效果如下:   这在我们未给输 ...

  2. css去除webkit内核的默认样式

    做移动端的朋友应该知道,iphone的默认按钮是个很恶心的圆角,select下拉框也有默认样式无法修改. 这时候可以用到 -webkit-appearance:none //去除默认样 在按钮和sel ...

  3. 修改input输入框的样式

    直接上代码 <style> .input{ -web-kit-appearance:none; -moz-appearance: none; font-size:1.4em; height ...

  4. html5中如何更改、去掉input type默认样式

    1.如何去掉input type=date 默认样式 HTML代码: 选择日期:<input type="date" value="2017-06-01" ...

  5. css修改select下拉列表的默认样式

    select的一些默认样式我们很难修改,比如图标的替换.接下来就说说如何修改这些默认样式: html代码: <div> <select name=""> & ...

  6. CSS消除button标签的默认样式

    button{ /*消除button的默认样式*/ /*这种写法是对所有的button标签同时生效*/ margin: 0px; padding: 0px; /*自定义边框*/ border: 0px ...

  7. (谷歌浏览器等)解决css中点击input输入框时出现外边框方法【outline:medium;】

    问题:在使用谷歌浏览器,360浏览器时,点击input输入框会出现带颜色的外边框,如下图所示:

  8. Chrome 下input的默认样式

    一.去除默认边框以及padding border: none;padding:0 二.去除聚焦蓝色边框 outline: none; 三.form表单自动填充变色 1.给input设置内置阴影,至少要 ...

  9. 去除input的默认样式

    input, button, select, textarea { outline: none; -webkit-appearance: none; border-radius: 0; } outli ...

随机推荐

  1. 用SVG做background image

    1 用utf8格式, 需要 双引号“”替换为单引号,而且采用url encode编码,例如# 替换为 %23, body { background-image: url("data:imag ...

  2. 使用gitblit搭建git服务器

    前言 一直在学习新技术,我想都整理到博客上.公司还在坚持用svn,之前学过git都快要忘记了,此篇博客记录搭建基于gitblit的git服务器.当然直接使用linux也可以,不过我不是很熟悉,考虑到我 ...

  3. spring静态注入

    与其说是静态注入(IOC),不如讲是对JavaBean 的静态成员变量进行赋值. 一般我们在使用依赖注入的时候,如果当前对象(javaBean )创建(实例化)一次,那么非静态的成员变量也会实例化一次 ...

  4. Java Native调用C方法

    1.通过JNI生成C调用的头文件:Java源码: import java.io.File; public class Test { static { System.load("D:" ...

  5. 注意source folder与folder是不同的,避免404错误

    在整合ssm框架的时候,程序和配置文件都没写错,tomcat也部署成功了,但在访问的时候一直404,web项目自带的index.jap却能正常访问,一直找不到原因,后来发现建立放配置文件的文件夹con ...

  6. C语言程序实现,统计字符串里面各个字符的个数在总字符个数中的比例,并打印输出。

    #include<stdio.h> int main() { char *ppp= "aaassadddeeds"; ] = {};//存放字符 uint32 ccnt ...

  7. js点击图片放大

    废话不说直接放代码了: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  8. 基于HALCON的模板匹配方法总结

    注:很抱歉,忘记从转载链接了,作者莫怪.... 基于HALCON的模板匹配方法总结 很早就想总结一下前段时间学习HALCON的心得,但由于其他的事情总是抽不出时间.去年有过一段时间的集中学习,做了许多 ...

  9. 魔力Python——对象

    Python之中,一切皆对象. 本文分为4部分: 1. 面向对象:初识 2. 面向对象:进阶 3. 面向对象:三大特性----继承,多态,封装 4. 面向对象:反射 0. 楔子 面向过程和面向对象的是 ...

  10. P1461 海明码 Hamming Codes

    题目描述 给出 N,B 和 D,要求找出 N 个由0或1组成的编码(1 <= N <= 64),每个编码有 B 位(1 <= B <= 8),使得两两编码之间至少有 D 个单位 ...