Css个别属性应用的示例分析

发布时间：2022-03-02 13:43:41 作者：小新
来源：亿速云阅读：96

小编给大家分享一下Css个别属性应用的示例分析，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！

CSS的继承性

CSS内部元素将继承外部元素的样式，多个外层元素的样式就叠加到内层元素上。<body>元素是网页中最大的标记，它中的样式将被其它子元素继承。

哪些CSS属性能被继承：color、font-size、font-weight、font-style、line-height、text-indent、letter-spacing、word-spacing、text-align等

CSS背景属性

Background-color：背景颜色

Background-image：背景图片，举例：background-image:url(images/bg.gif);

Background-repeat：背景平铺，取值：no-repeat(不平铺)、repeat(平铺)、repeat-x(x方向)、repeat-y(y方向)

Background-position：背景定位，取值：固定值或百分比

格式：background-position:水平方向垂直方向;

用固定值定位：background-position:100px 0px; //距离左边100px，距离上边0px

用百分比定位：background-position:50% 50%; //水平方向居中垂直方向居中

用单词来定位：background-postion:left|center|right top|center|bottom; 三个值取其中一个

Background-attachment：附加信息，取值：scroll(滚动)、fixed(固定)

简写形式：background:url(images/bg.gif) repeat-x 100px 0px; //多个属性值间用“空格”隔开

3.CSS浮动和清除

Float：元素浮动，取值：left或right。

Clear：清除浮动，取值：left或right或both

CSS浮动元素将向左向右浮动；

浮动可以叫“飘”起来；

浮动的元素，直到碰到父元素的边框或前一个浮动元素的边框为止；

浮动元素是一个块元素框，不管它原来是什么元素(行内元素)；

浮动元素不再占用空间，脱离了普通文档流，层级比普通元素的级别高；

清除浮动

清除浮动特性后，清除元素之后的其它元素将恢复默认排版；

清除浮动特性后，包围元素从视觉上看起来，像包围住了浮动元素；

4.CSS边框属性

Border：同时设置四个边框的属性

Border-left：设置左边框的属性

Border-right：设置右边框的属性

Border-top：设置顶边框的属性

Border-bottom：设置底边框的属性

格式：border-bottom：粗细线型线颜色;

举例：border-bottom：2px solid #FF0000; //元素的下边线为2px粗的实线，颜色为红色

线型取值：none(无边线)、solid(实线)、dashed(虚线)、dotted(点状线)、double(双线)

以上是“Css个别属性应用的示例分析”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注亿速云行业资讯频道！

相关阅读