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. 论文笔记之: Hierarchical Convolutional Features for Visual Tracking

    Hierarchical Convolutional Features for Visual Tracking  ICCV 2015 摘要:跟卢湖川的那个文章一样,本文也是利用深度学习各个 layer ...

  2. yii2 使用composer安装

    composer global require "fxp/composer-asset-plugin:~1.0.0" composer create-project --prefe ...

  3. 基于Spring框架的Shiro配置

    一.在web.xml中添加shiro过滤器  <!-- Shiro filter--> <filter> <filter-name>shiroFilter</ ...

  4. [内核]Linux workqueue

    转自:http://blog.chinaunix.net/uid-24148050-id-296982.html 一.workqueue简介workqueue与tasklet类似,都是允许内核代码请求 ...

  5. Android学习笔记(八)

    android中常见空间的使用方法 1.TextView TextView主要用于在界面上显示一段文本信息,如下面代码所示: <LinearLayout xmlns:android=" ...

  6. rsync+sersync实现文件实时同步

    前言: 一.为什么要用Rsync+sersync架构? 1.sersync是基于Inotify开发的,类似于Inotify-tools的工具 2.sersync可以记录下被监听目录中发生变化的(包括增 ...

  7. git 新建项目

    备份. 1.cd dirctory 2.git init 3.git.oschina.net 上新建项目. 4.git remote add origin XXX.git 5.git push ...

  8. 实用的VS工具

    工具 1.Visual Studio Visual Studio Productivity Power tool:Visual Studio专业版(及以上)的扩展,具有丰富的功能,如快速查找,导航解决 ...

  9. java maven诡异的错误no class found

    从服务器下载一个java web项目,启动老提示no class found,查看maven依赖库,相关的jar包都已经引入.同样一个项目,在别的机器都可以运行,唯独在我本机运行出错. 为了排错,将其 ...

  10. 课堂笔记--Strom并发模型

    Strom并发模型:     topology是如何运行的?(可与mapreduce对比)         第一层:cluster         第二层:supervisor(host.node.机 ...