css如何继承高度(css怎么继承)

http://www.itjxue.com  2023-01-29 06:12  来源:未知  点击次数: 

css 中宽高为什么没有继承?

只有块元素才可以默认“继承”其父元素的width.

浮动元素和定位元素也是不默认(不自动)“继承”其父元素宽度的。

当符合css默认“继承”的情况下(子元素必须是块级元素且无定位或浮动),是不需要写width属性,就可以默认“继承”的。

css中,怎样让一个class继承另一个class的属性?

1、新建一个html文件,命名为test.html。

2、在test.html文件内,使用table标签创建一个表格,并使用border设置表格边框为1px。

3、在test.html文件内,在table标签内,使用tr、td标签设置为两行两列表格。

4、在css标签内,设置类名为t1的样式,使用width属性设置宽度为250px,使用height属性设置高度为200px。

5、在css标签内,设置类名为t2的样式,使用font-size属性设置文字大小为20px,使用color属性设置文字颜色为红色,使用text-align属性设置文字居中。

6、在test.html文件内,在table标签内添加class属性,把class属性值设置为“t1 t2”,从而实现给表格添加两个class样式。

css中款高为什么没有继承?

css中的所有元素高度由内容决定,不走继承。

DOM根对象为document。中文意思就是文档。就像你写作文,开始动笔,压根不知道自己能写多少行内容,所以高度不确定。

高度不控制的应用主要是网站。但是如果做web应用,一般会进行元素的高度宽度控制。

那么如果想给所有元素进行高度控制。并默认继承父元素的所有高度只需要写一行CSS放在css最顶部:

*{

width:100%;

height: 100%;

padding:0;

margin:0;

}

10.CSS布局篇之line-height如何继承

1.写具体数值,如line-height:30px;,则继承该值

2.写比例,如2或者1.5,则继承该比例

3.写百分比,如200%,则继承计算出来的值(考点:重点是先计算后继承,所以继承的是父节点的计算结果而不是和比例一样是计算的当前节点的结果)

css 子块级元素会继承父块级元素的宽高吗?

css 子块级元素不会继承父块级元素的宽高。

在width属性的值设置成auto的情况下,块级元素内容区的宽度取决于左右外边距是否明确设置了值。如果左右外边距值都是auto,则左右外边距的值都会被重置为默认的值0;如果左右外边距中只有一个值是auto,则该值被重置为0,另一个值有效;如果左右外边距都设置了明确的值,两个值都将有效,此时元素内容区的宽度就是父元素的宽度减去左右外边距后的值。需要说明的是,左右外边距的默认值是0,这意味着如果没有在CSS规则中声明margin-left或者margin-right,它们就会使用默认值0。

在width属性的值设置为大于0的值的情况下,块级元素内容区的宽度就是由width属性设置的值。此时,左右外边距的值如果都是auto,则会使块级元素在其父元素中居中;如果左右外边距中只有一个值是auto,则明确设置的值有效,auto值会自动适应剩余的宽度;如果左右外边距都设置了明确的值,那么在从左往右阅读的语言中,会把右外边距的值重置为auto。

第一种情况:

规则是 p { margin-left:auto;width:auto;margin-right:auto; }

即,三个属性全都取auto值。如图3所示,结果是p元素的内容区的宽度和父元素div的宽度相等。根据前面的公式(此例未考虑左右边框和内边距,假设它们全取默认值0)我们知道,此时的margin-left:auto和margin-right:auto等同于margin-left:0和margin-right:0。或者说此时的左右外边距都等于0。

第二种情况:

规则是 p { margin-left:50px;width:auto;margin-right:auto; }

即,把左外边距明确设置为50像素,width和margin-right的值仍然是auto。如图3所示,结果是p元素的内容区宽度等于div元素的宽度减去50像素。也就是说,此时左外边距是50像素,而margin-right:auto相当于margin-right:0,即右外边距为0。

第三种情况:

规则是 p { margin-left:auto;width:auto;margin-right:50px; }

与第二种情况类似,只不过是把右外边距而不是左外边距明确设置为50像素。图3所示的结果告诉我们,此时右外边距是50像素,而左外边距为0。

(以上三种情况,值为auto的外边距都被重置为默认值0)

第四种情况:

规则是 p { margin-left:50px;width:auto;margin-right:50px; }

这次是把左、右外边距都明确地设置为50像素,而只有width属性是auto。如图3所示,结果是p元素内容区的宽度等于div的宽度减去(50+50=)100像素。也就是说,50像素的左、右外边距是有效的。p元素内容区在左右外边距之间以自动适应的宽度值补足了div元素的宽度。

第五种情况:

规则是 p { margin-left:auto;width:200px;margin-right:auto; }

这次把左、右外边距都设置为auto,而把width明确地设置为200像素。如图3所示,结果是p元素的内容区宽度就是设置的200像素,而且,由于左右外边距同为auto,使得p元素在div元素中水平居中。这种情况也是网页布局中最常用的居中块级元素居的主要手段。

第六种情况:

规则是 p { margin-left:50px;width:200px;margin-right:auto; }

这次margin-left和width分别明确设置成了50px和200px,只有右外边距的值是auto。从图3中可以看到,结果是p元素的内容区就是设置的200像素,而左外边距也是设置的50像素。但右外边距此时在前两个部分之后以自动适应的宽度值补足了div元素的宽度。

第七种情况:

规则是 p { margin-left:auto;width:200px;margin-right:50px; }

与第六种情况相似,但这次是左外边距在后两个部分之前以自动适应的宽度值补足了div元素的宽度。

第八种情况:

规则是 p { margin-left:50px;width:200px;margin-right:50px; }

这是一种典型的情况,即三个属性都明确地设置相应的值。从图3的结果中我们看到,只有左外边距和p元素内容区的宽度是设置的值。右外边距虽然也明确设置了50像素的值,但实际情况就像是使用了auto的第六种情况一样。实际上,在三个属性都明确设置了值,但其中一个值在没有解的情况下--即在不能满足三者之和等于div元素宽度的情况下--在从左往右阅读的语言中,会把右外边距重置为自动适应的宽度值,也就是auto。

css里有什么属性可以继承

手持手册给你找

布局:visibility,

颜色:color

字体:

属性 版本 继承性 描述

font ? ?CSS1/2 ? ?有 ? ?简写属性。定义元素的文本特性 ?

font-style ? ?CSS1 ? ?有 ? ?指定元素的文本是否为斜体 ?

font-variant ? ?CSS1 ? ?有 ? ?定义元素的文本是否为小型的大写字母 ?

font-weight ? ?CSS1 ? ?有 ? ?定义元素文本字体的粗细 ?

font-size ? ?CSS1 ? ?有 ? ?定义元素的字体大小 ?

font-family ? ?CSS1 ? ?有 ? ?定义元素文本的字体名称序列 ?

font-stretch ? ?CSS3 ? ?有 ? ?定义元素的文字是否横向拉伸变形 ?

font-size-adjust ? ?CSS3 ? ?有 ? ?定义小写字母x的高度与对象文字字号的比率。 ?

属性????版本????继承性????描述

text-transform ? ?CSS1/3 ? ?有 ? ?定义元素的文本如何转换大小写 ?

white-space ? ?CSS1 ? ?有 ? ?指定元素是否保留文本间的空格、换行;指定文本超过边界时是否换行。 ?

tab-size ? ?CSS3 ? ?有 ? ?定义元素内容中制表符的长度 ?

word-break ? ?CSS3 ? ?有 ? ?定义元素内容文本的字间与字符间的换行行为 ?

word-wrap/overflow-wrap ? ?CSS3 ? ?有 ? ?定义元素内容文本遇到边界时如何换行 ?

text-align ? ?CSS1/3 ? ?有 ? ?定义元素内容的水平对齐方式 ?

text-align-last ? ?CSS3 ? ?有 ? ?定义块内文本内容的最后一行(包括块内仅有一行文本的情况,这时既是第一行也是最后一行)或者被强制打断的行的对齐方式 ?

text-justify ? ?CSS3 ? ?有 ? ?定义使用什么方式实现文本内容两端对齐 ?

word-spacing ? ?CSS1/3 ? ?有 ? ?指定单词之间的额外间隙 ?

letter-spacing ? ?CSS1/3 ? ?有 ? ?指定字符之间的额外间隙 ?

text-indent ? ?CSS1/3 ? ?有 ? ?定义块内文本内容的缩进 ?

vertical-align ? ?CSS1/2 ? ?无 ? ?定义行内元素在行框内的垂直对齐方式 ?

line-height ? ?CSS1 ? ?有 ? ?定义元素中行框的最小高度 ?

text-size-adjust ? ?CSS3 ? ?有 ? ?定义移动端页面中元素文本的大小如何调整?

属性 版本 继承性 描述

text-decoration CSS1/3 无 简写属性。定义元素文本装饰

text-decoration-line CSS3 无 定义元素文本装饰线条位于文本的哪个位置

text-decoration-color CSS3 无 指定元素文本装饰线条的颜色

text-decoration-style CSS3 无 定义元素文本装饰线条的形状

text-decoration-skip CSS3 有 定义元素文本装饰线条必须跳过内容中的哪些部分

text-underline-position CSS3 有 定义元素装饰线的位置

text-shadow CSS3 有 定义文字是否有阴影及模糊效果

还有部分就不列了

检验?百度搜索CSS 4. 0,? 看下

CSS参考手册

版本:v4.2.7

最后更新时间:2018-4-10

编著:飘零雾雨

(责任编辑:IT教学网)

更多

推荐Javascript/Ajax文章