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;

              width: 380px;

              top: 50%;

              left: 50%;

              margin-top: -100x;　　　　//等于高度的一半

              margin-left: -190px;　　 //等于宽度的一半

            }

　　

css小tip的更多相关文章

  1. CSS小tip整理

    CSS小tip整理 1.利用css在列表靠头和末尾添加箭头: /* 左箭头*/ ol a[rel="prev"]:before { content: "\00AB&quo ...

  2. 小tip: 使用CSS将图片转换成模糊(毛玻璃)效果

    去年盛夏之时,曾写过“小tip: 使用CSS将图片转换成黑白”一文,本文的模式以及内容其实走得是类似路线.CSS3 → SVG → IE filter → canvas. 前段时间,iOS7不是瓜未熟 ...

  3. [转] 小tip: 使用CSS将图片转换成模糊(毛玻璃)效果 ---张鑫旭

    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=3804 去年盛夏之时, ...

  4. 小tip:CSS vw让overflow:auto页面滚动条出现时不跳动——张鑫旭

    小tip:CSS vw让overflow:auto页面滚动条出现时不跳动 这篇文章发布于 2015年01月25日,星期日,23:08,归类于 css相关. 阅读 46274 次, 今日 91 次 by ...

  5. 小tip: 使用CSS将图片转换成黑白(灰色、置灰)[转]

        小tip: 使用CSS将图片转换成黑白(灰色.置灰) 这篇文章发布于 2012年08月19日,星期日,20:41,归类于 css相关, SVG相关. 阅读 159943 次, 今日 146 次 ...

  6. 小tip: 某简单的字符重叠与图形生成----张鑫旭

    引言 字符重叠不是什么稀奇的东西. 如1像素错位模拟阴影效果: 或者powerFloat中展示的带边框三角: 以及其他很多. 但是技术这东西不是豆腐,老了可以吃,臭了也可以吃:那我这里还拿着个说事作甚 ...

  7. css小技巧（1）

    1.-webkit-overflow-scrolling: touch; 解决ios滑动时无缓冲问题 2.::-webkit-scrollbar 设置ios滑动时是否显示滚动条 3.::selecti ...

  8. HTML+CSS小实战案例

    HTML+CSS小实战案例 登录界面的美化,综合最近所学进行练习 网页设计先布局,搭建好大框架,然后进行填充,完成页面布局 <html> <head> <meta htt ...

  9. css小细节罗列

    有空时候把一些常见可能不是每个人都知道的css小细节总结了下,共勉. 1.line-height 众多周知,line-height是行高的意思,我们时常会使用类似line-height:24px;这样 ...

随机推荐

  1. 035. asp.netWeb用户控件之四通过用户控件实现投票和结果分析

    用户控件Vote.ascx代码 <%@ Control Language="C#" AutoEventWireup="true" CodeFile=&qu ...

  2. mysql的ONLY_FULL_GROUP_BY语义 --转自http://www.wtoutiao.com/p/19dh3ec.html

    执行SET GLOBAL sql_mode = ''; 把sql_mode 改成非only_full_group_by模式.验证是否生效 SELECT @@GLOBAL.sql_mode 或 SELE ...

  3. Python socket进阶 多线程/进程

    #首先,什么场合下用进程,什么场合下用线程: . 计算密集型的用进程. . IO密集型的用进程. xSocket语法及相关 Socket Families(地址簇) socket.AF_UNIX un ...

  4. (Design Pattern) Singleton.

    Role: The purpose of the Singleton pattern is to ensure that there is only one instance of a class, ...

  5. view坐标_ _ Android应用坐标系统全面详解

    转:http://blog.csdn.net/yanbober/article/details/50419117 1 背景 去年有很多人私信告诉我让说说自定义控件,其实通观网络上的很多博客都在讲各种自 ...

  6. A*算法入门

    来源:http://www.cppblog.com/mythit/archive/2009/04/19/80492.aspx 在看下面这篇文章之前,先介绍几个理论知识,有助于理解A*算法. 启发式搜索 ...

  7. Selenium

    Selenium可以抓取完整的页面的html但是request 和java的url不能抓的很完整. selenium的方法是dirver.page_source

  8. org.springframework.web.HttpRequestMethodNotSupportedException: Request method 'PUT' not supported

    1:先上控制台报错信息 org.springframework.web.HttpRequestMethodNotSupportedException: Request method 'PUT' not ...

  9. Android开发--环境的配置

    一 Android开发环境:JDK.eclipse ADT.海马模拟器或者夜神模拟器.配置之前先保证运行内存足够大,不然会导致运行卡. 二 JDK(不用安装) 1.jdk官方下载地址:http://w ...

  10. java, poi, excel

    工作需要用java操作Excel,现在网上搜索了一下,决定选取POI包来操作.pom内容如下: <dependency> <groupId>org.apache.poi< ...