html标签缺省(自带)样式大全

html标签默认样式整理

作者:佚名  来源:互联网 时间:07-30 16:54:48 

文为大家整理了html标签默认样式属性及浏览器默认样式等等,喜欢css布局的朋友们可以学下,希望对大家有所帮助

html,
address,blockquote,body, dd, div,dl, dt, fieldset, form,frame,
frameset,h1, h2, h3, h4,h5, h6, noframes,ol, p, ul, center,dir, hr,
menu, pre { display: block } 
li { display: list-item } 
head { display: none } 
table { display: table } 
tr { display: table-row } 
thead { display: table-header-group

tbody { display: table-row-group

tfoot { display: table-footer-group

col { display: table-column } 
colgroup { display: table-column-group

td, th { display: table-cell; } 

caption { display: table-caption

th { font-weight: bolder; text-align: center

caption { text-align: center } 
body { margin: 8px; line-height: 1.12

h1 { font-size: 2em; margin: .67em 0

h2 { font-size: 1.5em; margin: .75em 0

h3 { font-size: 1.17em; margin: .83em 0

h4, p, blockquote, ul, fieldset, form, ol, dl, dir, menu { margin:
1.12em 0 } 
h5 { font-size: .83em; margin: 1.5em 0

h6 { font-size: .75em; margin: 1.67em 0

h1, h2, h3, h4, h5, h6, b,strong { font-weight: bolder

blockquote { margin-left: 40px; margin-right: 40px

i, cite, em,var, address { font-style: italic

pre, tt, code, kbd, samp { font-family: monospace

pre { white-space: pre } 
button, textarea, input, object, select { display:inline-block;

big { font-size: 1.17em } 
small, sub, sup { font-size: .83em

sub { vertical-align: sub } 
sup { vertical-align: super } 
table { border-spacing: 2px; } 
thead, tbody, tfoot { vertical-align: middle

td, th { vertical-align: inherit

s, strike, del { text-decoration: line-through

hr { border: 1px inset } 

ol, ul, dir, menu, dd { margin-left: 40px

ol { list-style-type: decimal } 
ol ul, ul ol, ul ul, ol ol { margin-top: 0; margin-bottom: 0

u, ins { text-decoration: underline

br:before { content: ""A" } 
:before, :after { white-space: pre-line

center { text-align: center } 
abbr, acronym { font-variant: small-caps; letter-spacing: 0.1em

:link, :visited { text-decoration: underline

:focus { outline: thin dotted invert

 
BDO[DIR="ltr"] { direction: ltr; unicode-bidi: bidi-override

BDO[DIR="rtl"] { direction: rtl; unicode-bidi: bidi-override

*[DIR="ltr"] { direction: ltr; unicode-bidi: embed

*[DIR="rtl"] { direction: rtl; unicode-bidi: embed

@media print {  
h1 { page-break-before: always } 
h1, h2, h3, h4, h5, h6 { page-break-after: avoid

ul, ol, dl { page-break-before: avoid

浏览器默认样式 

1.页边距 
IE默认为10px,通过body的margin属性设置 
FF默认为8px,通过body的padding属性设置 
要清除页边距一定要清除这两个属性值 

复制代码

代码如下:

body { 
margin:0; 
padding:0; 

2.段间距 
IE默认为19px,通过p的margin-top属性设置 
FF默认为1.12em,通过p的margin-bottom属性设 
p默认为块状显示,要清除段间距,一般可以设置 

复制代码

代码如下:

p { 
margin-top:0; 
margin-bottom:0; 

3.标题样式 
h1~h6默认加粗显示:font-weight:bold;。 
默认大小请参上表 
还有是这样的写的 

复制代码

代码如下:

h1 {font-size:xx-large;} 
h2 {font-size:x-large;} 
h3 {font-size:large;} 
h4 {font-size:medium;} 
h5 {font-size:small;} 
h6 {font-size:x-small;} 

个大浏览器默认字体大小为16px,即等于medium,h1~h6元素默认以块状显示字体显示为粗体, 
要清除标题样式,一般可以设置 

复制代码

代码如下:

hx { 
font-weight:normal; 
font-size:value; 

4.列表样式 
IE默认为40px,通过ul、ol的margin属性设置 
FF默认为40px,通过ul、ol的padding属性设置 
dl无缩进,但起内部的说明元素dd默认缩进40px,而名称元素dt没有缩进。 
要清除列表样式,一般可以设置 

复制代码

代码如下:

ul, ol, dd { 
list-style-type:none; 
margin-left:0; 
padding-left:0; 

5.元素居中 
IE默认为text-align:center; 
FF默认为margin-left:auto;margin-right:auto; 

6.超链接样式 
a
样式默认带有下划线,显示颜色为蓝色,被访问过的超链接变紫色,要清除链接样式,一般可以设置 

复制代码

代码如下:

a { 
text-decoration:none; 
color:#colorname; 

7 鼠标样式 
IE默认为cursor:hand; 
FF默认为cursor:pointer;。该声明在IE中也有效 

8 图片链接样式 
IE默认为紫色2px的边框线 
FF默认为蓝色2px的边框线 
要清除图片链接样式,一般可以设置 
img { 
border:0; 
}

时间: 2024-08-30 17:21:09

html标签缺省(自带)样式大全的相关文章

Android中实现全屏、无标题栏的两种办法(另附Android系统自带样式的解释)

原文:Android中实现全屏.无标题栏的两种办法(另附Android系统自带样式的解释) 在进行UI设计时,我们经常需要将屏幕设置成无标题栏或者全屏.要实现起来也非常简单,主要有两种方法:配置xml文件和编写代码设置. 1.在xml文件中进行配置 在项目的清单文件AndroidManifest.xml中,找到需要全屏或设置成无标题栏的Activity,在该Activity进行如下配置即可. 实现全屏效果: android:theme="@android:style/Theme.NoTitleB

jquery实现标签支持图文排列带上下箭头按钮的选项卡_jquery

带上下箭头jquery垂直tab选项卡切换标签,技持左侧列表上下滚动,滚动到底部带信息提示. 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml

纯css+js写的一个简单的tab标签页带样式_javascript技巧

最近经常要用tab标签页,所以写了一个简单的,以后用的话直接拷贝一个,稍微改改就OK了. 先看效果图:  接下来看下代码怎么写的吧: 一.sp文件easytab.jsp 复制代码 代码如下: <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String b

Word2007中如何插入带样式的页码

我们在准备打印输出文档时,为了方便查看都会插入页码,但久而久之你是否发觉每篇文档都使用那几种固定的页码格式,没有丝毫新意,那就让我们一起来精心打扮一下在Word中插入的页码吧! ①单击"插入"选项卡,在"页眉页脚"控件组中单击"页码"→页面底端,在打开的预设样式中拖动滚动条找到"带状物"样式并单击,这样就会插入一个"带状物"样式的页码.当然也可以选择其它的样式如:堆叠纸张.箭头.镶嵌图案.星形.圆和矩形等样

POSTEK C168条码打印机标签纸和碳带安装

博思得Postek C168条码打印机 小巧轻便,功能强大,其独有"对流散热结构"和"左右式结构"专利设计,确保了这款产品在持久作业的同时,散热快,性能稳定,维护方便,为用户使用提供极大的便利. 可移动的反射式纸张探测器可校准不同规格的标签纸,同时配备固定的穿透式纸张探测器,可轻松实现孔状标签纸定位. Postek C168凭借其简单.易用.而又功能强大的特性赢得了较打的打印市场,下面深圳市互信恒科技以图文的方式介绍该款机的安装: 一.碳带安装 1).安装回收轴 2

Spinner样式大全

关于spinner控件有很多特殊的样式甚至是表现的很夸张的样式,这里就仅仅通过更换系统自带的xml样式来试验各种spinner样式效果. 首先在工程里创建最简单的spinner: 需要更换的地方有两处: 一.ArrayAdapter< String> adapter = new ArrayAdapter< String>( this, android.R.layout.simple_spinner_item); 这里面的第二个参数是android.R系统自带的xml样式,我们更换这

PHP导出带样式的Excel示例代码_php实例

前言 在大家工作中做导出的时候,需要导出自定义的表格或嫌弃导出的Excel格式太难看了.这时候就需要设置颜色.字号大小.加粗.合并单元格等等.这篇文章通过实例告诉大家怎么做,下面来一起看看. 先来看看效果图: 实例代码 PHP代码: /** * 导出文件 * @return string */ public function export() { $file_name = "成绩单-".date("Y-m-d H:i:s",time()); $file_suffix

帝国cms用灵动标签调用信息并带最新一条评论

如何用灵动标签调用信息,并调用这条信息的最新一条评论,答案如下: [e:loop={'selfinfo',10,0,0}]           //调用当前栏目下的最新10条信息 <?php $plb=$empire->fetch1("select * from phome_enewspl where id=".$bqr[id]); //查询当前信息所用的附表 $pla=$empire->fetch1("select saytext from phome_e

C#日期函数所有样式大全

函数  DateTime dt = DateTime.Now;//   Label1.Text = dt.ToString();//2005-11-5 13:21:25//   Label2.Text = dt.ToFileTime().ToString();//127756416859912816//   Label3.Text = dt.ToFileTimeUtc().ToString();//127756704859912816//   Label4.Text = dt.ToLocalTi