首页 » 技术分享 » HTML文本框

HTML文本框

 

开发工具与关键技术:DW
作者:文泽钦
撰写时间:2019年2月18日

想写出一篇好文章,有感觉但没有情绪怎么办;一个抒情的网页,希望能给爱写做的朋友带来灵感,首先写一个div包裹整个页面:

<div class=”box”>

   <!—标题,text-align:center;文字居中-->
   <h2 style=”text-align:center;”>依然无法忘记</h2>
   </div>

设置.box的样式:

在这里插入图片描述

写一个div包裹文本框;

<div class=”form”.>
<textarea cols=”30” placeholder=” 有些事,明知是错的,也要去坚持,因为不甘心;有些人,明知是爱的,也要去放弃,因为没有结局;有时候,明知没路了,却还在前进,因为习惯了。”></textarea>
</div>

form的样式:

.form{
width:500px;
height:780px;
}

textarea文本框的样式设置,style样式:
在这里插入图片描述
添加音乐播放器,smargin-lrft左边距:

<audio controls style="margin-left: 5px">
<!--音乐引入-->
          <source src="js/bysfs.mp3">
          </audio>

添加返回,保存按钮,和按钮的样式:

<!—float:left;左浮动-->

<div class="btn" style="float: right;">
                 <button style="width: 80px;height: 50px;margin-right: 15px;">返&nbsp;&nbsp;回</button>

                 <button style="width: 80px;height: 50px;background: #6EA1D1;color: #ddd;margin-right: 8px;">保&nbsp;&nbsp;存</button>
          </div>

在这里插入图片描述
效果图:

在这里插入图片描述

转载自原文链接, 如需删除请联系管理员。

原文链接:HTML文本框,转载请注明来源!

0