文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

CSS常用的几个属性介绍

2024-04-02 19:55

关注

这篇文章主要讲解了“CSS常用的几个属性介绍”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“CSS常用的几个属性介绍”吧!

5个实用的CSS属性

这篇文章介绍了5个实用的CSS属性。你应该很熟悉,但很可能很少会使用到。我并不是在谈论展望全新的CSS3属性,我指的是旧的CSS2中的属性,如:clip,min-height,white-space,curosr和display等一些被所有浏览器广泛支持的属性。因此,千万不要错过这篇文章,因为你可能发现它们竟有如此之大的用途。

1、CSSClip

剪辑(clip)属性就像一个面具。它允许你使用矩形掩盖页面元素的内容。要剪辑一个元素:你必须指定其position属性为absolute,然后指定相对于元素的top,right,bottom,left值。

CSS常用的几个属性介绍

图片剪辑实例(演示)

以下示例演示了如何使用clip属性掩盖一张图片。首先,指定

元素为position:relative,然后指定CSS常用的几个属性介绍

.clip{  position:relative;  height:130px;  width:200px;  border:solid1px#ccc;  }  .clipimg{  position:absolute;  clip:rect(30px165px100px30px);  }

2、Min-height(演示)

min-height属性允许你指定元素的最小高度,适用于需要平衡布局的情况。我将它用于Job面板上,以确保内容区域高于侧边栏。

CSS常用的几个属性介绍

.with_minheight{  min-height:550px;  }

IE6的Min-heighthack

注:神奇的IE6原生不支持min-height属性,不过幸好有一个min-heighthack。

.with_minheight{  min-height:550px;  height:auto!important;  height:550px;  }

3、White-space(演示)

white-space属性指定了元素中空白的处理方式。比如,指定white-space:nowrap会阻止文本自动换行。

CSS常用的几个属性介绍

em{  white-space:nowrap;  }

4、Cursor(演示)

如果你改变了按钮的行为,其指针也应该随之改变。比如,当一个按钮不可用时,指针应该改变为默认的箭头,来表明它不可点击。因此,cursor属性在开发Web应用程序时相当有用。

CSS常用的几个属性介绍

.disabled{  cursor:default;  }   .busy{  cursor:wait;  }   .clickable:hover{  cursor:pointer;  }

5、Displayinline/block(演示)

如果你不知道:块级元素是作为独立的一行来渲染的,而行内元素是在同一行被渲染的。

标签都是块级元素,,,都是行内元素。通过display:inline或block的方式,你可以重设这些元素的display样式。

CSS常用的几个属性介绍

.blockem{  display:block;  }   .inlineh5,.inlinep{  display:inline;  }

感谢各位的阅读,以上就是“CSS常用的几个属性介绍”的内容了,经过本文的学习后,相信大家对CSS常用的几个属性介绍这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是编程网,小编将为大家推送更多相关知识点的文章,欢迎关注!

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-前端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯