web基础，用html元素制作web页面

用div,form制作登录页面，尽可能做得漂亮。

练习使用下拉列表选择框，无序列表，有序列表，定义列表。

观察常用网页的HTML元素，在实际的应用场景中，用已学的标签模仿制作。

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>MIS15</title>
</head>
<body bgcolor="#FFD9EC"><h1> 张艺兴生日快乐  </h1><h2>Happy Lay's Day</h2>><img src="http://wx1.sinaimg.cn/large/d56a59a4gy1fka4jk1p9rj21ck1wwk8i.jpg" width="300" height="450" >
<div  id="container" style="width:400px;" ><div id="header" style="background-color:palevioletred"><h2 align="center" style="margin-bottom: 0;"><font face="华文行楷" color="black" size="6" >登 录 </font></h2></div><div id="content" style="background-color:pink;width:400px;float:left;line-height:40px;"><form >用户名:<br><input type="text" style="border-radius: 8px;height: 20px;width: 350px" name="user" PLACEHOLDER="请输入用户名"><br>密码:<a href="http://www.baidu.com"><font size="2" color="tomato"style="float: right" >忘记密码？</font> </a><br><input type="password" style="border-radius: 8px;height: 20px;width: 350px;" name="password" PLACEHOLDER="请输入密码"><br><div id="content" style="background-color:lightcoral;width:400px;float:left;line-height:40px;"><input type="checkbox" value="Keep me logged in">下次自动登录<br><input type="button" style="border-radius: 5px;background-color: seashell;height: 30px;width: 200px;margin-right: 10px;float: right"value="登录"></div></form></div><div id="footer" style="background-color:palevioletred;;clear:both;text-align:center;">版权©Judy-L</div>
</div>
<div  id="container" style="width:400px;" ><div id="header" style="background-color:palevioletred"><h2 align="center" style="margin-bottom: 0;"><font face="华文行楷" color="black"size="6">搜 索</font></h2></div><div id="content" style="background-color:lightpink;;;width:400px;float:left;line-height:20px;">范围：<select><option value="" style="color: #c2c2c2;">---请选择---</option><option>图片</option><option>饭拍视频</option><option>官方视频</option><option>音频</option></select><ul><li>MV汇总</li><li>花絮汇总</li></ul><ol><li>同人画作</li><li>饭制视频</li></ol></div><div id="footer" style="background-color:palevioletred;clear:both;text-align:center;">版权©Judy-L</div></div><br>
<p>友情链接</p>
<a href ="http://v.yinyuetai.com/video/3059775">张艺兴--SHEEP--MV</a></body> </html>

转载于:https://www.cnblogs.com/lyx1997/p/7662811.html

web基础，用html元素制作web页面相关推荐

Web基础（三）Python Web
文章目录 Python Web基础 1. WSGI 1.1 概述 1.2 实现原理 1.WSGI Server/gateway 2.WSGI Application 3.WSGI MiddleWare ...
Java Web基础入门第九讲 Java Web开发入门——再探Tomcat服务器
web应用程序 web应用程序指供浏览器访问的程序,通常也简称为web应用.例如有a.html.b.html--多个web资源,这多个web资源用于对外提供邮件服务,此时应把这多个web资源放在一个目 ...
web基础html元素制作web
转载于:https://www.cnblogs.com/lianghaohui123/p/7681908.html
java WEB 基础复习_开篇--Java Web基础知识
本篇主要是博客的开篇,是一些很基础的知识,我写博客的目的很简单.主要是供自己学习使用,督促自己学习,希望自己能坚持下来. 当前三大主流的Web动态网页技术是PHP(Personal Home Page ...
图片转web字体库，如何制作web字体库
最近项目上用到了很多svg图,设计师经常频繁改版,苦不堪言,于是就想到了把图片转成字体库来使用. 使用图片的缺点: 1. 图片加载速度慢 2. 图片大小固定,无法调节 3. 当代码重构或者图片目录位置 ...
网络对抗 Exp8 Web基础 20154311 王卓然
Exp8 Web基础 1. 实验内容 (1) Web前端HTML:能正常安装.启停Apache.理解HTML,理解表单,理解GET与POST方法,编写一个含有表单的HTML. (2) Web前端jav ...
【Web网页制作】影视主题网页制作web页面开发（附源码）
[写在前面] 其实之前我就写过一篇关于我的家乡的页面,也有不少网友和我私下反馈,让我多出一些关于页面制作的,于是乎我就今天晚上抽出点时间来整理一篇关于影视内容的web页面制作,希望能够得到大家的喜欢. ...
HTML5期末大作业——中华传统文化题材学生网页设计成品(6页) HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计 DW静态页面制作 web网页成品
HTML5期末大作业--中华传统文化题材学生网页设计成品(6页) HTML+CSS+JavaScript 学生DW网页设计作业成品 web课程设计网页规划与设计 DW静态页面制作 web网页成品常见 ...
ztree和php结合实例,实例详解jQuery EasyUI结合zTree树形结构制作web页面
JQuery EasyUI 结合 zTree树形结构制作web页面.easyui用起来比较简单,很好的封装了jquery的部分功能,使用起来更加方便,但是从1.2.3版本以后,商业用途是需要付费的,z ...

web基础，用html元素制作web页面

web基础，用html元素制作web页面相关推荐

最新文章

热门文章