html中留言表怎么写,html 留言板:

#body{

/*图片固定于桌面*/

background: url(img/hai.jpg) fixed center center no-repeat ;

/*background-size: 100%;*/

width: 100%;

height: 100%;

}

#div1{

width: 1200px;

height: 200px;

background-color: #28004D;

background: rgba(0,0,0,.5);

margin: auto;

position: relative;

margin-top:10px ;

border-radius: 10px;

}

#div3{

width: 1200px;

height: 80px;

background-color: #28004D;

background: rgba(0,0,0,.5);

margin: auto;

position: relative;

margin-top:10px ;

border-radius: 10px;

}

#div4{

width: 1200px;

height: 100%;

background-color: white;

background: rgba(0,0,0,.0);

margin: auto;

position: relative;

margin-top:10px ;

border-radius: 10px;

}

/*蓝鸥logal*/

#img1{

width: 150px;

height: 80px;

position: absolute;

left: 71px;

top: 15px;

}

/*字体*/

#s{

position: absolute;

top: 47px;

left: 233px;

color: white;

font-size: 25px;

opacity: 0.7;

}

/*图像*/

#div2{

position: absolute;

top: 19px;

left: 917px;

background-image:url(img/m.jpg);

width: 76px;

height: 76px;

border-radius: 50%;

background-color: white;

background-size: 67px;

}

/*字体大小*/

#span1{

position: absolute;

top: 35px;

left: 1011px;

font-size: 28px;

color: white ;

}

/*注销*/

#a1{

position: absolute;

top: 47px;

left: 1068px;

font-size: 18px;

color: red;

opacity: 0.3px;

}

#span2{

position: absolute;

left: 180px;

bottom:40px;

font-size: 25px;

color:#00FFFF;

}

#span3{

position: absolute;

left: 330px;

bottom:40px;

font-size: 25px;

}

#span4{

position: absolute;

left: 480px;

bottom:40px;

font-size: 25px;

}

#span5{

position: absolute;

left: 630px;

bottom:40px;

font-size: 25px;

}

#span6{

position: absolute;

left: 760px;

bottom:40px;

font-size: 25px;

}

#span7{

position: absolute;

left: 890px;

bottom:40px;

font-size: 25px;

}

#line{

width: 815px;

height: 2px;

position: absolute;

bottom: 20px;

left: 180px;

background-color: white;

}

#span8{

position: absolute;

left: 50px;

top: 20px;

color: white;

}

#t1{

position: absolute;

left:170px;

top: 10px;

background-color: #28004D;

background: rgba(0,0,0,.2);

width: 800px;

height: 60px;

color: white;

font-size: 18px;

}

#btn{

position: absolute;

left: 978px;

top: 10px;

width: 80px;

height: 20px;

background-color: #4DFFFF;

border-radius:10px ;

}

            l.png

安全管理平台

pc

注销登陆

产品信息

角色管理

账号信息

安全扫描

故障信息

值班管理

发表您的想法

发表内容

var textContent=document.getElementById("t1");

var btn=document.getElementById("btn");

var content=document.getElementById("div4");

//创建的

btn.οnclick=function(){

addDiv();

}

function addDiv(){

//放 名字,文本,线,日期

var divContent=document.createElement("div");

//姓名

var name1=document.createElement('n');

//文本

var textC=document.createElement("p");

//线

var line=document.createElement("div");

//日期

var date2=document.createElement("date1");

//刪除按鈕

var removeBtn=document.createElement("button");

//楼号

var float1=document.createElement("f");

var date1=new Date();

var year=date1.getFullYear();

var month=date1.getMonth()+1;

var day=date1.getDate();

var hour=date1.getHours();

var minite=date1.getMinutes();

var second=date1.getSeconds();

var datetime=year+":"+month+":"+day+" "+hour+":"+minite+":"+second;

//每一个divcont大小

divContent.style.position="relative";

divContent.style.height="100px";

divContent.style.width="900px";

divContent.style.margin="auto";

// divContent.style.backgroundColor="#CAFFFF";

divContent.style.backgroundcolor="#28004D";

divContent.style.background="rgba(0,0,0,.5)";0

//名字

name1.style.position="absolute";

name1.style.left="20px";

name1.style.top="20px";

name1.innerText="pc";

//内容

textC.style.position="absolute";

textC.style.height="50px";

textC.style.weight="700px";

textC.innerText=textContent.value;

textC.style.left="30px";

textC.style.top="30px";

//线

line.style.width="900px"

line.style.height="1px"

line.style.backgroundColor="black";

line.style.position="absolute";

line.style.left="0px"

line.style.bottom="5px";

//日期

date2.style.position="absolute";

date2.style.right="100px";

date2.style.bottom="8px";

date2.innerText=datetime;

date2.style.right="100px";

date2.style.bottom="8px";

//刪除按鈕

removeBtn.style.position="absolute";

removeBtn.style.right="100px";

removeBtn.style.bottom="70px";

removeBtn.style.height="20px";

removeBtn.style.width="45px";

removeBtn.innerText="删除";

removeBtn.style.backgroundColor="red";

//楼层排序

float1.style.position="absolute";

float1.left="10px";

float1.top="10px";

float1.innerText=content.children.length+1;

//添加

divContent.appendChild(float1);

divContent.appendChild(removeBtn);

divContent.appendChild(date2);

divContent.appendChild(name1);

divContent.appendChild(line);

divContent.appendChild(textC);

//倒叙添加

content.insertBefore(divContent,content.children[0]);

console.log(content.children.length);

删除:          removeBtn.οnclick=function(){               divContent.remove();                           var num=content.children.length;                            for(var i=0;i

  • 0
    点赞
  • 0
    收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
©️2022 CSDN 皮肤主题:深蓝海洋 设计师:CSDN官方博客 返回首页
评论
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值