03HTML+CSS

跟着视频完成第二天的综合案例,分别为新闻界面和注册案例

新闻界面代码

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6     <title>综合案例一</title>
 7 </head>
 8 <body>
 9     <ul>
10         <li>
11             <img src="./images/1.jpg">
12             <h3>主帅安东尼奥回西班牙休假 国青抵达海口进行隔离</h3>
13         </li>
14         <li>
15             <img src="./images/2.jpg" alt="">
16             <h3>梅州主帅:申花有强有力的教练组 球员体能水平高</h3>
17         </li>
18         <li>
19             <img src="./images/3.jpg" alt="">
20             <h3>马德兴:00后球员将首登亚洲舞台 调整心态才务实</h3>
21         </li>
22     </ul>
23 </body>
24 </html>

注册案例代码

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 
 4 <head>
 5     <meta charset="UTF-8">
 6     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 7     <title>注册信息</title>
 8 </head>
 9 
10 <body>
11     <h1>注册信息</h1>
12     <form action="">
13         <h2>个人信息</h2>
14         <label>姓名:</label><input type="text" placeholder="请输入真实姓名">
15         <br><br>
16         <label>密码:</label><input type="password" placeholder="请输入密码">
17         <br><br>
18         <label>确认密码:</label><input type="password" placeholder="请输入确认密码">
19         <br><br>
20         性别:
21         <label><input type="radio" name="gender"></label>
22         <label><input type="radio" name="gender" checked></label>
23         <br><br>
24         居住城市:
25         <select>
26             <option>北京</option>
27             <option>上海</option>
28             <option>广州</option>
29             <option>深圳</option>
30             <option selected>武汉</option>
31         </select>
32         <h2>教育精力</h2>
33         最高学历:
34         <select>
35             <option>博士</option>
36             <option>硕士</option>
37             <option>本科</option>
38             <option>大专</option>
39         </select>
40         <br><br>
41         <label>学校名称:</label><input type="text">
42         <br><br>
43         <label>所学专业:</label><input type="text">
44         <br><br>
45         在校时间:
46         <select>
47             <option>2015</option>
48             <option>2016</option>
49             <option>2017</option>
50             <option>2018</option>
51         </select>
52         --
53         <select>
54             <option>2019</option>
55             <option>2020</option>
56             <option>2021</option>
57             <option>2022</option>
58         </select>
59         <h2>工作经历</h2>
60         <label>公司名称:</label><input type="text">
61         <br><br>
62         <label>工作描述:</label>
63         <br>
64         <textarea></textarea>
65         <br><br>
66         <input type="checkbox">已阅读并同意以下协议:
67         <ul>
68             <li>
69                 <a href="./19-综合案例二.html"><ins>《用户服务协议》</ins></a>
70             </li>
71             <li>
72                 <a href="./19-综合案例二.html"><ins>《隐私政策》</ins></a>
73             </li>
74         </ul>
75         <br><br>
76         <button type="submit">免费注册</button>
77         <button type="reset">重新填写</button>
78     </form>
79 </body>
80 
81 </html>

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/772623.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

LockSupport

LockSupprot 用来阻塞和唤醒线程,底层实现依赖于 Unsafe 类(后面会细讲)。 该类包含一组用于阻塞和唤醒线程的静态方法,这些方法主要是围绕 park 和 unpark 展开。 public class Main {public static void main(String[] args) {Thread mainThread = Thread.currentThread(…

计算机组成与体系结构-浮点数表示

定点数: 是一种在计算机中表示和处理实数的方法,其中,小数点的位置是固定的,不会随着数值的大小而变化。浮点数: 是计算机中用于表示实数的一种数据类型。小数点 位置浮动浮点数表示阶码(指数部分): 决定了浮点数可以表示的范围。阶码越长,可以表示的指数范围就越大 尾数(有…

渗透

渗透测试 一、简介 ​ 渗透测试(Penetration Testing)是一种通过模拟攻击的技术与方法,挫败目标系统的安全控制措施并获得控制访问权的安全测试方法。 ​ 网络渗透测试主要依据CVE(Common Vulnerabilities and Exposures,通用漏洞与披露)已经发现的安全漏洞,模拟入侵者的攻击…

学习Java的第四周

第四周的学习记录来喽,本周的重点就是之前提到过的判断和循环(其中包括流程控制语句的三种结构:顺序、分支、循环;顺序结构即Java程序的默认流程,分支结构学了if判断语句的三种格式、switch语句练习和扩展知识,循环结构学了for循环格式和练习、累加思想和统计思想、while…

idea在pom中引入第三方依赖

项目右侧点击maven,点击加号(鼠标放上去会出现add maven project字样) 找到要导入的项目的pom文件选中,ok(这里我以及导入过了,所以ok是灰色) 回到原项目中,在pom中添加dependency 其中,artifactId是导入进来的姓名的名字,groupId是导入进来的项目的java目录下的包名…

计算机组成与体系结构-cache

概念 Cache,高速缓冲存储器。是解决CPU与主存之间速度不匹配而采用的一项重要技术,位于主存与CPU之间,由静态存储芯片(SRAM)组成,容量比较小,Cache存储了频繁访问的内存数据命中率 CPU欲访问的信息已在Cache中的比率,设在一段程序执行期间cache完成存取次数为NC,主存完成…

《Programming from the Ground Up》阅读笔记:p88-p94

《Programming from the Ground Up》学习第5天,p88-p94总结,总计7页。 一、技术总结 1.touppercase.s #PURPOSE: This program converts an input file #to an output file with all letters #converted to uppercase.#PROCESSING: #(1)Open the input file #(2)Open the o…

计算机网络第三讲 数据链路层

计算机网络第三讲 数据链路层 第一节:数据链路层功能 1. 概述2. 数据链路层的功能封装成帧透明传输差错控制实现无比特差错 不是可靠传输 丢失,乱序,重复无法解决

计算机组成与体系结构-层次化存储体系

将数据分为多个层次进行存储,以最优的控制调度算法和合理的成本,构成具有性能可接受的存储系统. 解决两个矛盾采用层次化存储体系,可以通过平衡存储介质的速度和成本得到最佳的存储效用。解决了主存容量不足与高成本的矛盾、CPU与主存速度不匹配的矛盾存储器分类RAM,随机存…

计算机网络第一讲

计算机网络第一讲 计算机网络概述考点一 1. 计算机网络的定义2. 计算机网络的组成物理组成工作方式英特网中的服务 考研中只有 TCP是可靠服务,其他都是不可靠的 面向连接的服务只有1.TCP 2.PPP 其他所有均无连接有应答服务:1.TCP 2.CSMA/CA3. 计算机网络的特点 共享4. 计算机…

计算机组成原理基础第7讲 输入输出系统

计算机组成原理基础第7讲 输入输出系统2. 输入输出系统的组成考点二:I/O接口接口的功能和组成I/O接口的基本组成3. 接口类型4. 程序查询方式考点三:中断系统