cuốn sách gpt4 ai đã làm

html - 旋转后文本的位置

In lại Tác giả: Walker 123 更新时间:2023-11-28 07:14:37 27 4
mua khóa gpt4 Nike

当我旋转一些跨度时,其中的文本没有水平对齐。你可以看到下面的例子。在这个例子中,我们有三个旋转的跨度,但我们有对齐问题。

thân hình{
padding-left:10px;
}
.bordered{
border-left: 2px solid gray;
vị trí: tương đối;
padding-top: 4em;
padding-bottom: 4em;
padding-left: 1em;
}
.bordered>span{
hiển thị: khối;
background-color: #ccc;
padding: 0.34em;
font-weight: 300;
font-size: 0.8em;
color: gray;
vị trí: tuyệt đối;
-webkit-transform: rotate(90deg);
lề: 0;
left: -2em;
top: ms(3);
}


Services





Works





Blog

câu trả lời hay nhất

Bạn có thể sử dụng transform-origin 属性来设置旋转点,默认情况下它是中心,并且您的跨度文本长度不同,这就是对齐在旋转时受到干扰的原因。如果你从左下角旋转它,它应该可以工作。

下面是修改后的 CSS 和 đây是演示链接

thân hình{
padding-left:10px;
}
.bordered{
border-left: 2px solid gray;
vị trí: tương đối;
padding-top: 4em;
padding-bottom: 4em;
padding-left: 1em;
}
.bordered>span{
-webkit-transform: rotate(90deg);
-webkit-transform-origin: 0% 0%;
hiển thị: khối;
background-color: #ccc;
padding: 0.34em;
font-weight: 300;
font-size: 0.8em;
color: gray;
vị trí: tuyệt đối;
left: -1px;
top: ms(3);
margin-left:10px
}

关于html - 旋转后文本的位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32424586/

27 4 0
Đề xuất bài viết: html - 在 CSS 中禁用转换的初始加载
Đề xuất bài viết: Javascript |网页 |饼图状态
Đề xuất bài viết: html - CSS float 空格
Đề xuất bài viết: jquery - 使导航菜单响应
Chứng chỉ ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com
Xem sitemap của VNExpress