#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 ;

}

安全管理平台

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

html中留言表怎么写,html 留言板:相关推荐

  1. php写网页留言界面

    php写网页留言界面 <?php$file = fopen("message.txt","a"); //向message.txt中追加if (isset( ...

  2. layui 子页面写弹出框覆盖父页面,以及给弹框中的表单赋值

    咋说呢,因为对 layui 不太熟悉,这个弹出框搞了好久,看了好多解决方案,大致尝试了一下其中几种,在坑中无法自拔...总之终于搞出来了,在这里分享一下我的笔记. 着急的直接 戳这里 看解决代码. 尝 ...

  3. asp mysql 留言本_我用php+mysql写的留言本

    我用php+mysql写的留言本 更新时间:2006年10月09日 00:00:00   作者: guestbook.php: COLOR: #002878; TEXT-DECORATION: non ...

  4. Python的Django框架中forms表单类的使用方法详解2

    用户表单是Web端的一项基本功能,大而全的Django框架中自然带有现成的基础form对象,本文就Python的Django框架中forms表单类的使用方法详解. Form表单的功能 自动生成HTML ...

  5. 统计数据库中各个表和空间使用情况

    为了方便大家使用,我写成了一个存储过程,如果喜欢就拿去吧,如果觉得有什么不对的地方,留言哈,我有一空就会修改! 废话少说,上代码(转载请注明出处,谢谢): SET ANSI_NULLS ON GO S ...

  6. 【Web技术】网站留言系统开发,及留言信息实时发送至指定邮箱

    [Web技术]网站留言系统开发,及留言信息实时发送至指定邮箱 关键字:HTML PHP JavaScript CSS 文章目录 [Web技术]网站留言系统开发,及留言信息实时发送至指定邮箱 0 简述 ...

  7. python代码大全表解释-Python中顺序表的实现简单代码分享

    顺序表python版的实现(部分功能未实现) 结果展示: 代码示例: #!/usr/bin/env python # -*- coding:utf-8 -*- class SeqList(object ...

  8. mysql join 组合索引,图文详解MySQL中两表关联的连接表如何创建索引

    本文介绍了MySQL中两表关联的连接表是如何创建索引的相关内容,分享出来供大家参考学习,下面来看看详细的介绍: 问题介绍 创建数据库的索引,可以选择单列索引,也可以选择创建组合索引. 遇到如下这种情况 ...

  9. 计算机页面布局与文档打印,Excel 2013中工作表的页面设置与打印——想象力电脑应用...

    工作表制作完成之后,很多时候还需要将工作表打印出来,在打印工作表之前一般需要先进行页面设置,并通过打印预览查看效果是否满意,当设置的效果达到所需要的效果后再进行打印. 一.页面设置 通过页面设置可以使 ...

最新文章

  1. python读取多个文件夹_在python中如何从不同的文件夹读取多个文件
  2. Android--Activity四种启动模式
  3. 2017将转行进行到底
  4. java时间类Date、Calendar及用法
  5. kafka生产者消息分区策略
  6. 国防科技大学计算机非军籍研究生就业情况,国防科技大学无军籍,将来就业前景怎样?涨知识了...
  7. 2020你一直在苦找的Ps插件全在这!20款Photoshop实用插件分享
  8. 【Android】【移动应用开发】APP案列
  9. 微信浏览器ISO系统底部导航栏
  10. c语言日历程序实验报告,万年历实验报告.doc
  11. Python连接MySQL数据库
  12. 计算机无法访问网络位置,共享不能访问网络位置的解决方法
  13. SSL证书错误了怎么办?
  14. autojs指纹验证
  15. C++ limits头文件的用法(numeric_limits)
  16. gba口袋妖怪c语言源代码,查看“精灵宝可梦 火红·叶绿”的源代码
  17. Alwayson 同步模式的坑
  18. Python计算机视觉之基于BOW的图像检索
  19. Object.defineProperty与proxy进行对比
  20. Windows 8.1中添加美式键盘

热门文章

  1. android字体斜体代码,Android设置Roboto字体用粗体,斜体,常规,…(类似于自定义字体系列)...
  2. YTU 2530: 小勇玩lol
  3. 鸿蒙大陆1.2正式版,鸿蒙大陆2.1正式版
  4. 0基础怎么学好Python?哪些基础知识必学?
  5. Q-in-Q 和 MAC-in-MAC
  6. MindSpore:【model_zoo】【resnet】尝试用THOR优化器运行时报cannot import name ‘THOR‘
  7. 4.抽样分布的概念与Python实现抽样
  8. 时序轮转的意思_时序是什么意思、词语时序的解释,汉语词典
  9. 面试问题:如何模拟SQL Server死锁 (附视频和脚本)
  10. excel乘法公式怎么输入_EXCEL函数公式大全利用IF函数ISNONTEXT函数提示输入数据自动计算...