css的reset和常用的html标签的默认样式整理
先看下常用的这些标签浏览器的默认样式有哪些:
body{ margin: 8px;}
hr{ border:1px inset; margin-top:.5em;margin-bottom:.5em;}
blockquote{margin: 16px 1em;}
ul{list-style-type: disc;padding-left:40px;margin: 1em 0;}
ol{list-style-type: decimal; padding-left:40px; margin:1em 0;}
dl{ margin: 1em 0;}
dd{ margin-left:40px;}
pre{ margin: 1em 0;}
fieldset{margin: 0 2px; border: 2px groove threedface;border-image: initial;padding:.35em .75em .625em;}
input,textarea,select,button{font: 400 13.333px Arial;}
button{padding:1px 6px;border:2px outset buttonface; background-color:buttonface;color:buttontext;}
input{ padding:1px 0;border:2px inset initial;}
textarea{padding:2px; border:1px solid rgb(169,169,169); resize:auto;}
th,td{padding:1px;}
h1,h2,h3,h4,h5,h6{font-weight:bold;}
h1{ font-size:2em;margin:.67em 0;}
h2{ font-size:1.5em; margin:.83em 0;}
h3{ font-size:1.17em; margin: 1em 0;}
h4{ margin: 1.33em 0;}
h5{ font-size:.83em; margin: 1.67em 0;}
h6{ font-size:.67em; margin: 2.33em 0;}
当然这里列举的都是常用的标签,那些不常用的或者是已经快被淘汰的就没列出来。
根据上面的默认样式,我们就可以有目标的去写reset里面需要重置哪些样式:
1,body的margin
2,ul,ol 的margin和padding
3,dl, dd 的margin
4,pre的margin ,这里pre还有一点要注意,就是它的font-size默认是13px,也可以重置下
5,fieldset的margin
6,input,textarea,select,button的font, border , textarea的resize,
7,th,td的padding
8, h1-h6我觉得不用重写,默认的font-weight和font-size设定的很好,margin上面可写可不写,我觉得设定的也没问题。
由此 ,我便生成了自己的 reset.css,很简洁,没有使用通配符 * 。
body,ul,ol,dl,dd,pre,fieldset{
margin:;
}
ul,ol{
padding:;
list-style:none;
}
input,textarea,select,button{
font-family:'Helvetica Neue',Tahoma,Arial,PingFangSC-Regular,'Hiragino Sans GB','Microsoft Yahei',sans-serif;
font-size:100%;
box-sizing:border-box;
}
pre{
font-size:1em;
}
table{
border-collapse: collapse;
border-spacing:;
}
a{
text-decoration: none;
}
a:hover{
text-decoration: underline;
}
当然,这只是我自己习惯用的reset,比如有些人就是喜欢把 box-sizing设置为border-box, 觉得那样计算起来很方便,我这里就没有使用通配符给所有元素都设置, 只给了几个表单元素。
这就是萝卜白菜各有所爱了,当时间长后,你肯定会生成自己的reset。
css的reset和常用的html标签的默认样式整理的更多相关文章
- html标签默认样式整理
引:http://www.jb51.net/web/94964.html 文为大家整理了html标签默认样式属性及浏览器默认样式等等,喜欢css布局的朋友们可以学下,希望对大家有所帮助 html, a ...
- CSS消除button标签的默认样式
button{ /*消除button的默认样式*/ /*这种写法是对所有的button标签同时生效*/ margin: 0px; padding: 0px; /*自定义边框*/ border: 0px ...
- 使用 CSS 去掉 iPhone 网页上按钮的超大圆角默认样式
使用 iPhone 上的浏览器去浏览网页的时候,按钮总是显示超大圆角的样式,显得超级恶心,但是我们自己定义 border-radius 为 0 也无法去除这个圆角,经过搜索发现这是 webikt 内核 ...
- 教你小三角,适用移动端等,解决移动端a标签的默认样式
1.小三角,通过给一个div设置足够大的边框,让它的上边框,右边框,左边框,的背景颜色设置成透明的,来实现,如下: <!DOCTYPE html> <html> <hea ...
- HTML标签的默认样式
body 有默认的内外边距(margin:0;padding:0); p 有默认的外边距(margin:0;)
- a标签去掉默认样式并自定义样式
a { text-decoration: none;//去掉下划线 color: inherit; -webkit-user-select: none; -moz-user-select: none; ...
- HTML的各个标签的默认样式
head{ display: none } body{ margin: 8px;line-height: 1.12 } button, textarea,input, object,select { ...
- 【input】标签去除默认样式
input{-webkit-appearance: none; -moz-appearance: none; -o-appearance: none; appearance: none;}
- Normalize.css 与 reset.css
Normalize.css 与 reset.css都是初始化页面样式 不同点在于 reset.css更加粗暴,直接把所有的样式全部初始化了: Normalize.css还剩点良心,还保留了一些浏览器默 ...
随机推荐
- C# Redis Server分布式缓存编程(一)(转)
出处:http://www.cnblogs.com/davidgu/p/3262571.html 这篇文章我将介绍如果用最简洁的方式配置Redis Server, 以及如何使用C#和它交互编程 一. ...
- Interceptor for {http://cxf.liuyang.com/}IHiServiceService has thrown exception, unwinding now org.apache.cxf.binding.soap.SoapFault: Error reading XMLStreamReader.
Jquery同域访问:客户端连接服务器访问跨域访问:通过本地html文档,浏览器点击开访问(jquery不支持此访问) 用域名的方式访问http://localhost:8080/CXF_09_jqu ...
- ASIHTTPRequest-Cookie的使用[转]
ASIHTTPRequest允许你使用全局存储来和所有使用CFNetwork或者NSURLRequest接口的程序共享cookie. 如果设置useCookiePersistence为YES(默认值) ...
- NTLM认证协议及SSPI的NTLM实现
没错,NTLM就是你听说过的那个NTLM.是微软应用最广泛的认证协议之一. NTLM是NT LAN Manager的缩写,这也说明了协议的来源.NTLM 是 Windows NT 早期版本的标准安全协 ...
- CentOS 7上搭建Docker环境
一.Docker介绍和安装 http://linux.cn/article-4340-1.html Docker 是一个开源工具,它可以让创建和管理 Linux 容器变得简单.容器就像是轻量级的虚拟机 ...
- ashx、aspx、ASP.NET MVC
ashx:ProcessRequest(IHandler的方法)aspx:Page_Load(Page继承IHttpHandler)(RouteHandler)(HttpHandler)(MvcHan ...
- sql 存储过程带有模糊查询条件
一个简单的存储过程: Create procedure [dbo].[Proc_SeachJob] (@startRecordIndex int, @endRecordIndex int, @seac ...
- C#学习(1):类型约束
where T : class泛型类型约束 类型参数约束,.NET支持的类型参数约束有以下五种: where T : struct | T必须是一个结构类型 where T : class T必须是一 ...
- MVC控制器中动作方法返回的结果
在MVC控制器中主要的返回方式有如下几种: 1.Content(): 返回文本类型的ContentResult,比如“这是我做的一个MVC”. 2.File(): 返回文件类型的内容FileResul ...
- SQL去除重复记录
SQL去除重复记录 if not object_id('Tempdb..#T') is null drop table #T Go Create table #T([ID] int,[Name ...