gpt4 book ai didi

javascript - 自定义元素大小不正确

转载 作者:太空宇宙 更新时间:2023-11-04 12:50:44 24 4
gpt4 key购买 nike

我创建了一个自定义元素来处理一些数据传递,它做得很完美。此时,我想添加一些样式以使我的自定义元素能够像 div 一样工作。具体来说,我在其中一个中有一个表格,我不希望它在我向其添加数据时在页面上向下增长。

现在,我的 html 看起来有点像这样:

<head>
<script>
var myProto = Object.create(HTMLElement.prototype);
myProto.method = function(){};

document.register('my-element', {prototype: myProto});
</script>
</head>
<body>
<my-element>
<table>
<tr><td>Foo</td><td>Bar</td><tr>
<tr><td>Foo</td><td>Bar</td><tr>
<tr><td>Foo</td><td>Bar</td><tr>
<tr><td>Foo</td><td>Bar</td><tr>
</table>
</my-element>

<script>/*Other Code*/</script>
</body>

我想设计它的样式,以便我可以指定类似这样的 css:

my-element{
height : 200px;
overflow-x : scroll;
}

问题是自定义元素的大小似乎无法适应它们的内容,因此 heightoverflow 不会影响它们。

Fiddle.

最佳答案

就像任何其他元素一样设置它的样式。您的 CSS 语法无效。

试试这个:

my-element {
height:200px;
overflow-x:scroll;
}

我自己的工作示例: http://jsfiddle.net/ynreuka1/

更新:您的自定义元素不是 block 级元素。添加 display:block; 然后就可以了:

http://jsfiddle.net/ynreuka1/3/

另一个更新,具有特定的尺寸和滚动条:

http://jsfiddle.net/ynreuka1/4/

关于javascript - 自定义元素大小不正确,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26170479/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com