html中div裹div,html – 围绕div包裹textarea输入

博客讨论了如何在textarea周围环绕一个div元素的问题。通过将textarea替换为一个具有contenteditable属性的div,实现了文本环绕div的效果。提供的代码示例中,div定位在右上角,并且textarea(现为contenteditable div)占据了整个空间。
摘要由CSDN通过智能技术生成

我的右上角有一个带有div框的textarea字段.我已经搜索了很多,但我找不到一种方法让输入textarea的文本环绕该div.

有任何想法吗 ?

#wrapper {

position: relative;

width: 500px;

height: 500px;

}

#logo {

width: 100px;

height: 100px;

position: absolute;

right: 10px;

background-color: cyan;

}

textarea {

width: 100%;

height: 100%;

}

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam acumsan fringila lacus, in rhoncus ligula pretium eu. Nulam blandit vel quam ut posuere. Sed tincidunt comodo lacinia. Vivamus eget ulamcorper sapien. Phaselus gravida pretium sem, non fringila orci luctus vel. Donec augue sapien, pharetra portitor fringila hendrerit, ultrices in telus. In aliquet laoret turpis vitae ultrices. Praesent eget nula et telus pelentesque suscipit ac eu est. Nula sed imperdiet dui. Donec eficitur est dolor, nec placerat ex posuere pretium.

最佳答案 我发现了这个非常古老的讨论:

Unusual shape of a textarea?

给出的答案是在div上使用contenteditable属性.

我设法得到这个代码,似乎是你正在寻找的.

#wrapper {

width: 500px;

height: 500px;

}

#logo {

width: 100px;

height: 100px;

float:right;

background-color: cyan;

}

.textarea {

width: 100%;

height: 100%;

}

LOGO
HTML

我只是替换< textarea>与< div class =’textarea’contenteditable =’true’>和位置:绝对; with float:right;.

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值