The Famous Meyer Reset
The CSS
- html, body, div, span, applet, object, iframe,
-
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
-
a, abbr, acronym, address, big, cite, code,
-
del, dfn, em, font, img, ins, kbd, q, s, samp,
-
small, strike, strong, sub, sup, tt, var,
- dl, dt, dd, ol, ul, li,
- fieldset, form, label, legend,
-
table, caption, tbody, tfoot, thead, tr, th, td {
-
margin: 0;
-
padding: 0;
-
border: 0;
-
outline: 0;
-
font-weight: inherit;
-
font-style: inherit;
-
font-size: 100%;
-
font-family: inherit;
-
vertical-align: baselinebaseline;
- }
-
- :focus {
-
outline: 0;
- }
- body {
-
line-height: 1;
-
color: black;
-
background: white;
- }
- ol, ul {
-
list-style: none;
- }
-
- table {
-
border-collapse: separate;
-
border-spacing: 0;
- }
-
caption, th, td {
-
text-align: left;
-
font-weight: normal;
- }
- blockquote:before, blockquote:after,
- q:before, q:after {
-
content: "";
- }
- blockquote, q {
-
quotes: "" "";
- }
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
body {
line-height: 1;
color: black;
background: white;
}
ol, ul {
list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}
This is the most useful css reset out there, i use it for almost everything I work on (even the 52framework, coming soon).
相关推荐
本篇文章将详细介绍10个免费且强大的CSS3工具,这些工具能够帮助开发者更高效地设计和优化网站。 1. **CSS3 Generator**:这个在线工具允许用户快速生成CSS3属性,如渐变、阴影、边框半径等,大大简化了代码编写...
这份"10个Web前端开发中免费且非常有用CSS代码共2页.pdf.zip"压缩包文件包含了10个实用且免费的CSS代码片段,这些代码可以帮助开发者提高工作效率,实现各种复杂的网页设计效果。以下是对这些知识点的详细解释: 1....
【CSS速成教程 10分钟学会】 CSS(Cascading Style Sheets)是网页设计中的核心技术,用于定义页面布局、颜色、字体等视觉效果。它让网页内容与表现分离,提高了网页的可维护性和可扩展性。在大型网站中,CSS的应用...
标题中的“纯CSS一个DIV悬浮并且FF圆角”是指如何仅使用CSS来实现一个浮动的div元素,并在Firefox浏览器下保持圆角效果。这个话题涵盖了CSS布局、定位以及浏览器兼容性方面的知识。以下是对这些知识点的详细解释: ...
下面将详细讨论CSS3中的线条旋转以及如何实现多个线条的loading加载动画。 首先,CSS3中的`transform`属性允许我们对元素进行旋转、缩放、平移和倾斜等变换。对于线条的旋转,我们主要使用`rotate()`函数,其语法为...
随着技术的发展,虽然我们通常所说的CSS3已经成为现代前端开发的标准,但"CSS40个布局实例"这个主题可能指的是利用CSS3的高级特性来实现的40种不同的布局解决方案。这些实例旨在帮助开发者掌握各种复杂的网页布局...
10. **伪类与伪元素**:如`:hover`、`:active`、`:focus`、`:first-child`等伪类和`::before`、`::after`等伪元素在创建交互效果和增强视觉反馈时非常有用。 通过深入研究`CSS2e_MM_TUTORIALS`中的源代码,你不仅...
CSS4Free是一个免费提供CSS设计资源的网站,它不仅包含了各种高质量的设计案例,还提供了一些实用的设计工具和技术指南,对于初学者来说尤其有用。 #### 18. CSSGalaxy CSSGalaxy是一个汇集了大量优秀CSS设计作品的...
10. **浏览器兼容性**:尽管CSS3标准已经相当成熟,但各浏览器对某些特性的支持程度不一,因此了解和使用工具如Can I Use来检查兼容性是必要的。 以上就是关于CSS的一些关键知识点,通过深入学习和实践,你可以掌握...
10. **CSS层叠**:CSS的层叠规则决定了哪些样式会覆盖其他样式。理解权重计算(内联样式 > ID选择器 > 类选择器 > 标签选择器)是解决样式冲突的关键。 11. **CSS重置**:为了消除浏览器之间的默认样式差异,通常会...
标题中的“10-23-css3手风琴”指的是一个使用CSS3实现的手风琴效果的示例项目。在网页设计中,手风琴效果通常用于在一个有限的空间内展示可展开和折叠的内容块,这在展示多个相关但不都需要同时显示的信息时非常有用...
在描述中提到的链接是一个CSDN博客文章,作者分享了如何使用CSS3创建一个图片画廊。这种效果通常包含以下几个关键知识点: 1. **响应式设计**:CSS3中的媒体查询(Media Queries)允许我们根据设备屏幕大小调整布局...
本篇文章将深入探讨“常见非常有用CSS兼容”这一主题,基于你提供的信息,我们将分享一些实用的技巧和解决方案,帮助你应对各种浏览器之间的差异。 1. **CSS前缀**: 许多新的CSS特性在初期并未被所有浏览器广泛支持...
每个CSS文件都会被转换为一个JavaScript对象,其中类名被自动转换为唯一字符串,确保组件的样式只对其自身生效。 2. **CSS-in-JS** CSS-in-JS是一种将CSS写在JavaScript代码中的风格,比如使用styled-components库...
下面详细介绍的是10个在Web前端开发中免费且非常有用的CSS代码。 #### 1. Loaders.css - **概述**:Loaders.css 是一款专为性能优化而设计的CSS框架,旨在通过简单的CSS样式实现各种加载动画效果。 - **特点**: -...
10. **颜色和透明度**:除了更多的颜色关键字和十六进制颜色,CSS3还引入了rgba()函数,允许设置颜色的透明度,以及hsl()和hsla()颜色模式,以色调、饱和度和亮度来定义颜色。 在这个"餐厅练习"中,可能涉及创建一...
完整的DIV+CSS教程,网站设计是做软件的入门,也是最简单,而且最为实用的设计需求。这么多年软件做下来,其实基本上软件设计的原理都有那么一些继承和发展。这篇文章对于初学网站前端设计的朋友很有用。学了这个,...
这样的工具对于初学者或者需要提高工作效率的专业人士来说,尤其有用,因为它简化了编写HTML和CSS的流程,避免了手动编写时可能犯的错误。 在HTML中,标签是用来定义网页内容和结构的关键元素,如`<div>`、`<p>`、`...