gpt4 book ai didi

javascript - 如何为网页创建弹出式文本区域

转载 作者:行者123 更新时间:2023-11-28 13:55:13 25 4
gpt4 key购买 nike

我是 HTML 新手,我必须为用户输入创建一个 textarea,如下图所示。

请问有人知道如何创建这种类型的textarea吗?

我只有创建简单textarea的基本知识。提前致谢。 enter image description here

最佳答案

Demo here

尝试使用 border-leftborder-rightborder-top 宽度以获得合适的凹口设计

HTML

<textarea></textarea>

<div id="notch"></div>

CSS

textarea{
width:300px;
height:80px;
border:1px solid #7c7870;
background:#7c7870;
color:#fff;
border-radius: 8px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.6);
-webkit-box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.6);
}

#notch{
position: relative;
top:-4px;
left: 200px;
margin: 0;
border-bottom: 0;
border-left: 30px solid transparent;
border-right: 10px solid transparent;
border-top: 40px solid #7c7870;
padding: 0;
width: 0;
height: 0; /* ie6 height fix */
font-size: 0;
line-height: 0; /* ie6 transparent fix */
_border-right-color: pink;
_border-left-color: pink;
_filter: chroma(color=pink);
z-index:99;
}

关于javascript - 如何为网页创建弹出式文本区域,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8352527/

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