实现标签和布局样式问题

时间：2023-03-31 02:04:16 CSS

应该实现下图效果：问题左上角标签的边框宽度为0.5px，字体大小为15px；下面的文字和标签之间的距离是16px。所有元素都具有固定宽度和自适应高度。solutionshtml代码客户支持

支持客户支持就可以了其次是开发商的adipisicing。我们从不指责从事其他职责的乐趣本身，这种麻烦，我将通过选择常规劳动来解释。当时，他很沮丧，他们不知道如何接待他。

CSS代码.parent{width:300px;背景：一枝黄花；}#wrapper{位置：相对；}#label{宽度：100px；边框：1px纯黑色；字体大小：30px；变换：比例（.5）；变换原点：00；立场：绝对；顶部：0；left:0;}.content{margin-top:16px;}js代码varlabel=document.getElementById('label');varwrapper=document.getElementById('wrapper');varlabelHeight=window.getComputedStyle(label).height;wrapper.style.height=parseInt(labelHeight)/2+'px';##心路县程first，0.5p一般情况下不支持x的边框宽度和15px的字号。在这种情况下，使用CSS3缩放。并以父元素的左上角为缩放原点。#label{宽度：100px；边框：1px纯黑色；字体大小：30px；变换：比例（.5）；transform-origin:00;}.content{margin-top:16px;}效果是这样的可以看出，标签虽然被缩放了，但是还是占据了原来大小的空间。所以就说明了加入蓝框wrapper的意义，让label脱离文档流和文本流，同时占据一席之地。（float不能脱离文本流）进一步的代码是这样的：#wrapper{border:1pxsolidblue;位置：相对；}#label{宽度：100px；边框：1px纯黑色；字体大小：30px；变换：比例（.5）；变换原点：00；位置：绝对；顶部：0；左：0；}.content{边框：1px纯红色；边距顶部：16px；包装纸都塌了，怎么占空间？label的高度不确定，wrapper的高度怎么设置？我不得不使用js：wrapper.style.height=parseInt(labelHeight)/2+'px';效果：我胡汉三回来了~有更好的方法请指教~

上一篇：如何在屏幕上水平和垂直居中div

下一篇：《css 揭秘》读书笔记

实现标签和布局样式问题相关文章