页面制作

1．整个页面采用article标记构架。使用header、footer、hgroup、figure、figcaption、form、fieldset等标记来进行页面布局。技术网址
2．会议注册页面，采用fieldset、legend进行表单元素分组。在其中分别采用input类型为text、email、tel、date、submit、reset等来布局页面，注册姓名、报告题目、工作单位等文输入域不能为空。
3．页面样式控制，统一采用行内样式。
4．页面效果及结构分析如下：

实现代码

<!doctype html>
<html lang="en"><head><meta charset="UTF-8"><title>2020中国互联网大会</title></head><body><article style="display:block;width: 25cm;margin:0 auto;background-color:rgb(188,109,238)"><p><header><hgroup><h1 style="text-align:center" >2020中国互联网大会</h1><h3 style="text-align:center" >寻找中国互联网产业新动能”活动启动</h3><p style="text-indent:2em;margin-left:1cm;margin-right:1cm;margin-bottom:1cm;">2020(第十九届)中国互联网大会将于7月23日-25日在云端召开,本届大会由线上论坛、线上展览和特色活动组成。作为特色活动之一,“寻找中国互联网产业的新动能”活动现已正式启动。</p><figure style="text-align:center;"><img src="internet.png" width="550px" border="0"><br><figcaption>新基建，新机遇</figcaption></figure></hgroup></header><form method="post" action=""><center><fieldset style="font-family:宋体;text-align:center;margin:10px 40px;"><legend>会议注册页面</legend>注册姓名：<input type="text" required>报告题目：<input type="text" required><br>工作单位：<input type="text" required>手机号码：<input type="tel" ><br>电子邮件：<input type="email">报告时间：<input type ="date"><br><input type ="submit" value="注册">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="reset" value="重置"></center></fieldset></form></p><p style="font-family:宋体;text-indent:2em;margin-left:0.5cm;margin-right:0.5cm;margin-bottom:0.5cm;margin-top:0.5cm">本次寻找活动的主题是“新基建,新机遇 — 寻找中国互联网产业的新动能”。聚焦在线教育、企业应用、智慧交通、医疗新基建和网络安全等领域,将动员社会各界力量、广泛征集案例、聆听多方观点,组织专家点评,最终寻找出在时代背景下对互联网产业产生积极、深刻影响的案例(产品、服务、解决方案),激发更多的企业找到与“新基建”有机结合的发展新机遇,释放出推动自身发展、促进产业升级的新动能。</p><br></article></body>
</html>

实现界面

细节处分析

设置背景颜色方法
两种方法：

取色器取色
QQ截图时按住鼠标左键不要松开在右下角就有改颜色的rgb值

  <article style="display:block;width: 25cm;margin:0 auto;background-color:rgb(188,109,238)">

设置文本的上下左右间距让页面更加美观

style="text-indent:2em;margin-left:1cm;margin-right:1cm;margin-bottom:1cm;"

其中text-indent:2em;代表首段空两个空格

设置一个提交与重置按钮

 <input type ="submit" value="注册">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="reset" value="重置">

这些年的成长让我意识到，敢于直视自己过的不好，是一条很有意思的出路。

HTML5构建“2020中国互联网大会”会议注册页面相关推荐

计算机视觉顶会ECCV 2020中国预会议：日程公开，注册有奖
ECCV 2020中国预会议邀请参加计算机视觉盛宴官网:https://event.baai.ac.cn/event/53 或点击阅读原文报名,线上会议免费注册欧洲计算机视觉国际会议(ECCV) ...
ECCV 2020 中国预会议邀请您参加计算机视觉盛宴
ECCV 2020中国预会议邀请参加计算机视觉盛宴点击阅读原文报名,线上会议免费注册欧洲计算机视觉国际会议(ECCV)是计算机视觉三大顶级会议之一,每两年举办一次.录用的论文代表了计算机视觉领域 ...
世平信息签署2020中国互联网大会《电信和互联网行业网络数据安全自律公约》
7月23日,由中国互联网协会主办的2020年(第19届)中国互联网大会以网络大会形式在"云端"开幕,本届大会结合新基建.5G.人工智能.工业互联网.区块链等热门话题,以" ...
线上 | ICCV 2021中国预会议日程公开，注册有奖
ICCV 2021中国预会议邀您参加计算机视觉盛宴官网:https://event.baai.ac.cn/event/162 或点击阅读原文报名,线上会议免费注册中国际计算机视觉大会 (ICCV ...
产融对接数智服务 | 用友云服务亮相2020中国5G+工业互联网大会
11月19日,"2020中国5G+工业互联网大会"在湖北武汉盛大举行,大会汇集政产学研用等各方面的智慧和力量,共同探讨5G+工业互联网融合发展的思路举措,推动制造业转型升级和经济高 ...
会议报到和撒离时间算会期_【明日报到】2020中国（三门峡）食用菌新产品新技术博览会工作人员开始分装资料...
关注食用菌产业分会,携手发展中国菌业! (点击图片可放大) 由中国乡镇企业协会食用菌产业分会.中国食用菌商务网联合主办,三门峡农产品销售企业大联盟.食用菌市场编辑部承办的" 2020中国(三 ...
CSS页面优化构建一个注册页面
一.效果图二.内容分析 1.首先是给整个页面插入一张背景图:在<head></head>标签中写一个<style></style>标签,用body{} ...
html css实现登录注册页面,基于HTML5+css+JS_的精美登陆注册界面
[实例简介] 基于HTML5+css+JS的精美登陆注册界面------------------------------- [实例截图] [核心代码] login4 ├── index.html ├─ ...
前端学习笔记（注册页面综合案例html5）
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" ...

HTML5构建“2020中国互联网大会”会议注册页面

HTML5页面制作

页面制作

实现代码

实现界面

细节处分析

HTML5构建“2020中国互联网大会”会议注册页面相关推荐

最新文章

热门文章