zoukankan      html  css  js  c++  java
  • css小tip

    1. <input>标签的默认样式

    当在页面中添加一个input标签,当点击输入框时会有一个外边框包裹着,可以使用 :
    input { outline: none} 去除点击时产生的外边框包裹默认样式

    input{border: none} 去除input标签的默认样式

    2. div自适应浏览器高度

    html,body{
    	height:100%;
    	overflow:hidden;
    }
    /*需要自适应的div*/
    .container {
    	height: 100%;
    }

    3. display:none与visible:hidden的区别

    display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别:

    display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就是看不见也摸不到。

    visible:hidden--- 使对象在网页上不可见,但该对象在网页上所占的空间没有改变,通俗来说就是看不见但摸得到。

    例子:

    <html>
    <head>
    <title>display:none和visible:hidden的区别</title>
    </head>
    <body >
    <span style="display:none; 隐藏区域</span><span style=" background-color:Green">显示区域</span><br />
    <span style="visibility:hidden; 隐藏区域</span><span style="background-color:Green">显示区域</span>
    </body>
    </html>

    4.空格转义字符

    记录一下,空格的转义字符分为如下几种:

    平时一般用的是&nbsp;

    1. &nbsp;&160#;不断行的空白(1个字符宽度)

    2. &ensp;&8194#;半个空白(1个字符宽度)

    3. &emsp;&8195#;一个空白(2个字符宽度)

    4. &thinsp;&8201#;窄空白(小于1个字符宽度)

    平时一般用的是&nbsp;但是在中文中也许有时候更适合用&emsp;

    5. 垂直水平居中

    1. 父元素div设置为relative;

    2. 子元素div

    table{
                  position: absolute;
                  height: 200px;
                   380px;
                  top: 50%;
                  left: 50%;
                  margin-top: -100x;    //等于高度的一半
                  margin-left: -190px;   //等于宽度的一半
                }    
    

      

  • 相关阅读:
    2.如何搭建MQTT环境
    1.如何安装maven
    4.线程同步-未使用线程同步的生产者/消费者关系
    3.线程的优先级和线程调度
    2.如何使用matlab拟合曲线
    1.如何安装matlab2016a
    2.线程状态:一个线程的声明周期
    Oracle"TNS监听程序找不到符合协议堆栈要求的可用处理程序"解决方案
    快速登录MySQL数据库
    数据仓库模型建设基础及kimball建模方法总结
  • 原文地址:https://www.cnblogs.com/shaunZh/p/5636168.html
Copyright © 2011-2022 走看看