HTML+CSS练习

最新推荐文章于 2024-06-24 14:04:15 发布
最新推荐文章于 2024-06-24 14:04:15 发布
阅读量196 收藏
点赞数 1
文章标签： html css 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_65353494/article/details/137011253
版权

用户注册页面

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>用户注册</title>
	</head>
	<body>
		<table border="1" cellspacing="0" align="center">
		<form action="#">
			<tr><td colspan="2">用户注册</td></tr>
		    <tr>
				<td><label for="username">用户名</label></td>
				<td><input type="text" name="useername" id="username"></td>
			</tr>
			<tr>
				<td><label for="username">密码</label></td>
				<td><input required="password" type="password" name="password" id="password"></td>
			</tr>
			<tr>
				<td><label for="username">性别</label></td>
				<td><input type="radio" name="gender" value="male" checked>男
				<input type="radio" name="gender" value="female">女
				</td>
			</tr>	
			<tr>
				<td><label for="uaername">爱好</label></td>
				<td><input type="checkbox" name="writing" value="写作">写作
				<input type="checkbox" name="music" value="听音乐">听音乐
				<input type="checkbox" name="sport" value="体育">体育
				</td>
			</tr>
			<tr>
				<td><label for="uaername">省份</label></td>
				<td>
					<select>
						<option>陕西省</option>
						<option>四川省</option>
						<option>山西省</option>
					</select>
					
				</td>	
			</tr>
			<tr>
				<td>自我介绍</td>
				<td><textarea name="comment" id="comment" cols="30" rows="10"></textarea></td>
			</tr>
			<tr>
				<td><input type="submit" value="注册"></td>
				<td><input type="reset" value="重置"></td>
			</tr>	
		</form>
		</table>
	</body>
</html>

QQ注册页面

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			span{
				color: blue;
				font-size: 12px;	
			}
		</style>
	</head>
	<body>
		<table border="0" cellspacing="0" align="center" >
		<tr>
			<td colspan="3"></td>
			<td>
				<select>
					<option>简体中文</option>
					<option>English</option>
				</select>
			</td>
			<td>意见反馈</td>
            	
            
			
		</tr>	
		<tr>
			<td rowspan="9" colspan="2"><img src="9.png" height="300px" width="200px"></td>
		    <td>欢迎注册QQ</td>		
		</tr>
		<tr>
			<td>每一天，乐在沟通</td>
			<td><span>免费靓号</span></td>	
		</tr>
		<tr>
			<td><input type="text"  placeholder="昵称"></td>	
		</tr>
		<tr>
			<td><input required="password" type="password" placeholder="密码"></td>
		</tr>
		<tr>
			<td>
				<select name="num">
					<option value="+86">+86</option>	
				</select>&nbsp;<input type="number"  placeholder="手机号码">
			</td>	
		</tr>
		<tr>
			<c><td>可通过手机号找回密码</td></c>
				
		</tr>
		<tr>
			<td><input type="image" src="8.png" width="180px" height="30px"></td>	
		</tr>
		<tr>
			<z><td><input type="radio">我已阅读相关服务条款和隐私政策</td></z>
		</tr>
		</table>
	</body>
</html>

QQ登陆页面

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			span{
				color: blue;
			}
			a{
				size: 12px;
			}
			d{
				size: 30px;
			}
			
		</style>
	</head>
	
	<body>
		<table border="1" cellpadding="0" cellspacing="0">
		    <tr>
			    <td colspan="2">QQ登录</td>
			    <td><a>QQ登录|授权管理|申请接入</a></td>
		    </tr>
		    <tr>
			    <td class=""><strong>账号密码登录</strong></td>
		    </tr>
		    <tr>
			    <td><d>推荐使用<span>快速安全登录</span>，防止盗号。</d></td>
			    <td><span>腾讯网</span>&nbsp;将获得以下权限：</td>
		    </tr>	
		    <tr>
		    	<td><input type="text" placeholder="支持QQ号/邮箱/手机号登录"></td>
		    	<td><input type="checkbox">全选</td>
		    	
		    </tr>
		    <tr>
		    	<td><input required="password" type="password" placeholder="密码"></td>
		    	<td><input type="checkbox">获得您的昵称，头像，性别及会员信息</td>
		    </tr>
		    <tr>
		    	<td><input type="image" src="7.png" height="40px" width="150px"></td>
		        <td>授权后表明你已同意<span>QQ登录服务协议</span></td>
		    </tr>
		    <tr>
		    	<td colspan="1"><p align="right">忘了密码|注册新账号|意见反馈</p></td>
		    </tr>
		</table>
		
		
	</body>
</html>

 

新浪微博

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>sina新浪网</title>
		<style>
			span{
				color: blue;
			}
		</style>
	</head>
	<body>
		<table border="1" cellspacing="0">
			<tr>
			    <td colspan="2" style="width: 800px;">sina新浪网</td>
			    <td>新浪首页|帮助</td>
		    </tr>
			<tr>
				<td><input type="submit" value="手机注册"> <input type="submit" value="邮箱注册"></td>
			   
			</tr>
			<tr>
				<td>手机账号：<input type="number"></td>
				<td>已有帐号，<span>直接登录》</span></td>
			</tr>
			<tr>
				<td>使用微博账号直接<span>登录</span></td>
			</tr>
			<tr>
				<td>设置密码：<input type="password" required="password"></td>
			</tr>
			<tr>
				<td>
					兴趣标签：
					<input type="checkbox" value="新闻">新闻
					<input type="checkbox" value="娱乐">娱乐
					<input type="checkbox" value="文化">文化
					<input type="checkbox" value="体育">体育
					<input type="checkbox" value="IT">IT
					<input type="checkbox" value="财经">财经
					<input type="checkbox" value="时尚">时尚
					<input type="checkbox" value="汽车">汽车
					<input type="checkbox" value="房产">房产
				</td>
			</tr>
			<tr>
				<td>上发短信手机：<input type="submit" value="我要使用注册手机发送短信"</td>
			</tr>
			<tr>
				<td><span>《新浪网络服务使用协议》</span></td>
			</tr>
			<tr>
				<td><span>《新浪个人信息保护政策》</span></td>
			</tr>
			</table>
			<table border="0" cellpadding="0" cellspacing="0" >
				<tr>
				<td style="width: 90px;"><span>新浪简介</span></td>
				<td style="width: 90px;"><span>About&nbsp;Sina</span></td>
				<td style="width: 90px;"><span>广告联系</span></td>
				<td style="width: 90px;"><span>联系我们</span></td>
				<td style="width: 90px;"><span>招聘信息</span></td>
				<td style="width: 90px;"><span>网站律师</span></td>
				<td style="width: 90px;"><span>SINA&nbsp;English</span></td>
				<td style="width: 90px;"><span>注册</span></td>
                <td style="width: 90px;"><span>产品答疑</span></td>
			</tr>
			</table>
			<table border="0" cellspacing="0" cellpadding="0">
				<tr>
				<td style="width: 500px;">客户联系电话&nbsp;400-052-0066&nbsp;欢迎批评指正</td>
			</tr>
		    <tr>
		    	<td style="width: 800px;">Copyright&nbsp;1996-2020&nbsp;SINA&nbsp;Corporation&nbsp;All Bights Reserved 新浪公司 版枳所有</td>
		    </tr>
			</table>
			
			
			
				
			
			
		
		
		
		
		
	</body>
</html>

 

云起兮
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
html+css 练习项目 星巴克咖啡网站主页.zip
12-14
基于html+css+js进行网页设计 课程设计 毕业设计 供参考 源码+说明 基于html+css+js进行网页设计 课程设计 毕业设计 供参考 源码+说明 基于html+css+js进行网页设计 课程设计 毕业设计 供参考 源码+说明 基于...
仿小米官网首页的一个html+css练习demo.zip
12-14
基于html+css+js进行网页设计 课程设计 毕业设计 供参考 源码+说明 基于html+css+js进行网页设计 课程设计 毕业设计 供参考 源码+说明 基于html+css+js进行网页设计 课程设计 毕业设计 供参考 源码+说明 基于...
HTML+CSS练习项目
[ 「今でもあなたは私の光。」❤️如今你依旧是我的光。
04-13 235
【代码】HTML+CSS练习项目。
html+css网页练习一
qq_52108058的博客
02-02 6999
阅读下列说明、效果图和HTML代码，进行静态网页开发。 这个某项目中的其中一个活动页，应用html和css技术完成页面的布局。项目包含主页index.html、style.css，css和img文件夹分析： 4、style.css 二、改革进展与成效管理平台页面 1、要求 阅读下列说明、效果图和HTML代码，进行静态网页开发。 项目名称为“改革进展与成效管理平台”，包含首页index.html、css文件夹、img文件夹，其中，css文件夹包含normalize.css文件；img文件夹包含用到的图片。大
html+css网页练习四
qq_52108058的博客
02-07 4144
阅读下列说明、效果图，完成静态页面。 某购物网站首页页面局部效果。当鼠标悬停到导航文字上时，背景色会变为红色。现在我们需要编写该网站效果图部分代码。 项目包含首页index.html、img文件夹和css文件夹，页面效果如图所示。 4、style.css 二、活动页面 1、要求 阅读下列说明、效果图和HTML代码，进行静态网页开发，主要应用HTML和css3完成。 这个某项目中的其中一个活动页，应用HTML5和css3技术完成页面动画。鼠标没经过是图1，当鼠标经过是图2，当鼠标经过遮罩层像翻书一样显示出来
html+css综合练习一
qq_52108058的博客
02-13 1101
阅读下列说明、效果图，进行静态网页开发。 某网站注册页面开发项目，点击立即注册，进入第二个页面。项目名称为xiaomi，包含首页index.html、css文件夹，其中，css文件夹包含style.css文件。分析： 3.2、style.css 二、下午茶页面 1、要求 阅读下列说明、效果图，进行静态网页开发。 项目包含首页index.html、img文件夹和css文件夹，页面效果如图所示 4、style.css 三、法国巴黎页面 1、要求 阅读下列说明、效果图，进行静态网页开发。 项目包含首页inde
HTML+JS+CSS 小练习
m0_47887988的博客
03-16 630
目标图片： 主要实现功能： 1、图片浏览 2、购物车数量加减 3、网页跳转 4、全选与全不选 5、删除购物车中物品 6、计算总价 代码（第一个页面）： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>中袖衬衣2015春季装新款时尚白领修身职业装</title> <style type=..
初学HTML+CSS练习搭建个人博客笔记
热门推荐
向着太阳迎着光
10-13 2万+
前言 工作需求初学html+css的使用，在网上看视频学着写了一个个人博客 在这边只是做一下自己的学习笔记记录，如果对你有帮助，你就稍微看看，如果没有请忽略！下面上html代码： Document ......
html+css网页练习二
qq_52108058的博客
02-04 1675
这是某茶叶公司的官网，以下效果图是商品展示页。 该项目包含prolist.html、css文件夹、img文件夹，其中，css文件夹包含include.css文件；img文件夹包含所用到的图片。分析： 4、include.css 二、电商网站页面 1、要求 这是某电商网页其中的页面，以下效果图是购物车模块。 该项目包含index.html、css文件夹、img文件夹，其中，css文件夹包含index.css文件；img文件夹包含所用到的图片。分析： 4、index.css 三、顶部信息栏页面 1、要求 项
html+css网页练习三
qq_52108058的博客
02-05 2299
另外，为【技术】设置宽度为“17%”、外边距为“4%”；为【技术logo】设置高度为“200px”、宽度为“200px”、边框颜色为“#000000”、边框为“1px、实线”、边框设置“20px圆角”；（2）【网站介绍】样式：为页面上端【网站介绍】部分添加背景颜色“#000000”，并设置宽度为“100%”、高度为“400px”、字体颜色为“#FFFFFF”。另外，为【欢迎语】和【网站内容介绍】内容设置“绝对布局”、距顶部边缘“16%”、距左边缘“16%”、宽度为“68%”、文本内容“居中”。
HTML+CSS练习——实现京东登录静态页面
weixin_48466991的博客
07-09 6666
首先打开 京东登录页面，按下F12，依次按着步骤进行。把所需要的素材都下载下来。 1、html的基本知识 2、css的基本知识
html+css入门小项目巩固练习
weixin_42290123的博客
03-21 1160
html+css入门小项目巩固练习 在B站通过视频复习了之前在学校学习的前端知识，然后在B站找了一个小的实战项目跟着练习，花了半天的时间实现如下： 1.首页 2.关于我们 3.联系我们 码云源码地址： https://gitee.com/jia_ya_jun/html-css-exercises ...
【HTML+CSS练习二】学成在线首页
03-06
练习使用的HTML代码、CSS代码和部分图片素材，简单易懂。
html+css+js新手练习项目
10-08
html+css+js新手练习项目，里面包含例子源码，还有单独文件夹分类。适合新手练习用
某学校官网静态网页, 纯html+css练习.zip
01-02
html css js 知识学习资料 代码 源码 供相关人员学习参考 html css js 知识学习资料 代码 源码 供相关人员学习参考 html css js 知识学习资料 代码 源码 供相关人员学习参考 html css js 知识学习资料 代码 源码 供...
HTML(12)——背景属性
m0_74386799的博客
06-20 548
可以只写一个关键字，另外一个方向默认居中，坐标只写一个表示水平方向，垂直方向为居中。contain：等比缩放背景图片以完全。cover：等比缩放背景图片以完全。属性值：水平方向位置，垂直方向位置。作用：背景图不会随着元素的内容滚动。使用背景图实现装饰性的图片效果。属性值:url(背景图URL)坐标：数字+px 正负都可。背景区，可能背景图部分看不见。背景区，可能背景区部分空白。背景图默认是平铺的效果。
html渲染的文字样式大小不统一解决方案
weixin_49720804的博客
06-21 213
用自己输入、粘贴、或者通过按钮插入的文字 在html页面上渲染出来的文字样式大小不统一解决办法
HTML【介绍】
最新发布
尽欢的博客
06-24 299
HTML是带html或Htm扩展名的文件。若要在浏览器中显示各种网页，则需要 html文件(HTML基本结构+内容+标签)和 css文件(css风格)才能实现所需的漂亮网页。HTML的一些标签代码规则将内容呈现在浏览器中所需的风格。IE浏览器、火狐浏览器（Firefox）、谷歌浏览器（Chrome）、Safari浏览器、欧朋浏览器（Opera）Html文件中的代码包含一些规则、规则、标签和内容。形成具有指定的html结构和内容的完整的HTML文件。文字、图片、音频、视频、超链接。
HTML(15)——盒子模型
m0_74386799的博客
06-20 775
div {
html+css官网
08-31
仿写其他网页是学习和练习HTML和CSS的一种方法，而定位元素的方法可以帮助我们在网页中找到特定的元素。<span class="em">1</span><span class="em">2</span><span class="em">3 #### 引用[.reference_title] - *1* ...

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

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值