写一个简单的HTML页面

美少女降临人世间

于 2019-09-26 14:15:42 发布

阅读量2w

点赞数 14

分类专栏： HTML/CSS学习文章标签： HTML页面简单的HTML页面一个简单的HTML页面

本文链接：https://blog.csdn.net/qq_41306364/article/details/101439925

版权

本文介绍如何创建一个简单的HTML页面，模仿火狐的首页。页面包含表单、按钮、单选框和背景图片。代码为v1.0版本，作者计划在后续文章中添加CSS样式进行美化。

摘要由CSDN通过智能技术生成

简单的HTML页面

写一个火狐的首页，我设置了皮肤，背景是本地图片。
这是人家原网页的样子↓
在这里插入图片描述

思路

一个表单，两个按钮，三个单选框。
六个div。图片是png矢量图。或者自己截的截图。

效果图

此代码是v1.0版本，刚开始搞，还没有精细。但是基本思路就是这样，精进版放在后续的一篇文章添加CSS样式https://blog.csdn.net/qq_41306364/article/details/101473118中。
在这里插入图片描述

代码

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body background="imgs/bg.jpg">
	<div style="margin-top: 20px">
		<button
			style="margin-left: 80px; color: #FFFFFF; background-image: linear-gradient(rgb(241, 168, 74), rgb(219, 110, 24)); border: 1px solid rgb(219, 110, 21); border-radius: 2px; box-shadow: rgb(247, 202, 127) 0px 0px 0px 1px inset; padding: 2px 4px;">设为默认浏览器</button>
		<img style="float: right; margin-right: 90px" src="imgs/1.png" />
	</div>
	<div align="center" style="margin-top: 10px">
		<form action="">
			<img alt=

最低0.47元/天解锁文章

美少女降临人世间

关注

14
点赞
踩
98

收藏

觉得还不错? 一键收藏
1
评论
写一个简单的HTML页面

简单的HTML页面写一个火狐的首页，我设置了皮肤，背景是本地图片。思路一个表单，两个按钮，三个单选框。六个div。图片是png矢量图。或者自己截的截图。效果图代码<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Insert title here&lt...
复制链接

扫一扫

专栏目录