css中三种样式的方法(id,class,style)的实例分析

我们可以使用三种方法来给一个对象(例如div,span,table)应用样式。 

1:使用#定义样式,并使用id为对象应用样式。 
例: 

nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    Id    
用Id来给对象应用样式
  

登录后复制

2:使用.定义样式,并使用class为对象应用样式。 
例: 

nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    Id    
用class来给对象应用样式
  

登录后复制

3:不定义样式,直接使用style为对象应用样式。 
例: 

nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    Id   
用style来给对象应用样式
  

登录后复制

使用这三种方法所产生的效果是相同的,但我们需要注意的是,这三种方法间的优先级问题。 
如果我们对一个对象同时使用上述三种方法定义样式,会怎么样呢? 
比如我们先定义一个#STYLE { font-size:12px; }再定义一个.STYLE { font-size:14px; }最后在对象上使用style=”font-size:16px;”代码如下: 

nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    Id    
用三种方式同时来给对象应用样式
  

登录后复制

这种情况下,浏览器会根据三种方式的优先级,即style>id>class来为对象应用样式。上述例子中,div中的文字会显示为16px大小。 

立即学习“前端免费学习笔记(深入)”;

以上就是css中三种样式的方法(id,class,style)的实例分析的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/3122576.html

(0)
上一篇 2025年3月29日 18:19:56
下一篇 2025年3月29日 18:20:03

AD推荐 黄金广告位招租... 更多推荐

相关推荐

发表回复

登录后才能评论