CSS样式中display属性用法指导

本文和大家重点讨论一下CSS display属性的使用,CSS display属性值基本上分为inline,block,和none;block元素前后换行,标题和段落元素是块元素;而none,意思不显示元素,在可用性上可以实现漂亮的效果,交替样式或hover效果的高级运用。

成都创新互联2013年至今,是专业互联网技术服务公司,拥有项目成都网站制作、网站建设网站策划,项目实施与项目整合能力。我们以让每一个梦想脱颖而出为使命,1280元建水做网站,已为上家服务,为建水各地企业和个人服务,联系电话:18980820575

CSS display属性

操作HTML元素的诀窍在于明白它们工作的方法在于没有特定的形式。一些由标签组成的大部分页面可以设定任何样式。浏览器默认的样式里的大部分html元素由字体样式、margin,padding组成,本质上是显示类型。

CSS display属性基本上有inline,block,和none三个属性值。

inline就像它的本意??显示为inline的元素为行。strong,anchor锚和em强调元素默认是行。

block元素前后换行。标题和段落元素是块元素。

none,意思不显示元素,在可用性上可以实现漂亮的效果,交替样式或hover效果的高级运用。

设定表现可以更好运用在网页制作上。

 
 
 
  1. h1 {  
  2.     display: inline;  
  3.     font-size: 2em;  
  4. }  
  5. #header p {  
  6.     display: inline;  
  7.     font-size: 0.9em;  
  8.     padding-left: 2em;  
  9. }  

设定标题h1为行元素,可以和后面的元素在同一行。

 
 
 
  1. #navigation, #seeAlso, #comments, #standards {  
  2.     display: none;  
  3. }  
  4.  

上面的代码可以使用在打印样式里,比如在导航使用,可以在打印时不显示导航这些无关紧要的东西。

CSS display:none和visibility:hidden;的不同在于CSS display:none完全取消元素的显示,visibility:hidden保持元素位置但视觉上的内容不可见。例如,如果3的第二段设置为display:none,第一段将仅跟在第三段,如果设置为visibility:hidden,段落间就会空出。

文章题目:CSS样式中display属性用法指导
本文URL:http://www.hantingmc.com/qtweb/news9/74709.html

网站建设、网络推广公司-创新互联,是专注品牌与效果的网站制作,网络营销seo公司;服务项目有等

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联