使用html制作个人主页

刚刚学习了关于HTML的基本操作就做一个个人主页练练手，但由于是第一次写，比较粗糙，有很多不足，希望大家批评和指正，共同进步，共同学习。

首先分享一个学习html各种标签方法的学习网站
w3chool

进入正题

网页分为五个部分，首页，我的相册，大三大四学习规划，我的家乡，我的故事

首页

这一页主要练习字体大小颜色，超链接，横线和标题，表格，背景图片的添加

我的相册

这一页主要练习图片的插入和排布，和使用图片作为超链接的标志

大三大四学习规划

这一页主要练习无序列表和表格的边框大小颜色，表单里的定义按钮返回首页

我的家乡

这页主要练习段落和在文字中插入图片

我的故事

最后一页练习的表单里的各种操作，创建文本域，下拉列表，多行文本域，提交按钮。

代码

首页：

<html><head><title > 这里是我自己的宇宙</title></head><body background="D:\图片\16.jpg"><hr /><h1 align="center">欢迎来到我的世界</h1><hr/>
<font size="6" color="blue">
<pre><p  align="center">             <a  href="file:///C:/Users/90964/Desktop/%E9%A6%96%E9%A1%B51.html" >首页</a>             <a  href="file:///C:/Users/90964/Desktop/%E6%88%91%E7%9A%84%E7%9B%B8%E5%86%8C.html" >我的相册</a>             <a  href="file:///C:/Users/90964/Desktop/%E5%A4%A7%E4%B8%89%E5%A4%A7%E5%9B%9B%E5%AD%A6%E4%B9%A0%E8%A7%84%E5%88%92.html" >大三大四学习规划</a>           <a  href="file:///C:/Users/90964/Desktop/%E6%88%91%E7%9A%84%E5%AE%B6%E4%B9%A1.html" >我的家乡</a>           <a  href="file:///C:/Users/90964/Desktop/%E6%88%91%E7%9A%84%E6%95%85%E4%BA%8B.html" >我的故事</a>                </p></pre><br><br><p align="center">
<table width="400" height="200" border="1">
<font size="20">
<tr>
<th>姓名</th>
<th>生日</th>
<th>兴趣</th>
</tr>
<tr>
<td align="center">裴艺涵</td>
<td align="center">6.28</td>
<td align="center">摄影，旅行</td>
</font>
</p><p align="center">愿自己坚定而柔软，自信而谦逊，阳光而皎洁</p></body>
</html>

我的相册

<html>
<head>
<title>关于自己的记忆</title>
</head>
<body>
<p>
<img src="D:\图片\timg.jpg" alt=“山”   width="500" height="400"><img src="D:\图片\3.jpg"  alt=“云” width="500" height="400">  <img src="D:\图片\2.jpg"  alt=“鹿”width="500" height="400">
<br>
<a href="file:///C:/Users/90964/Desktop/%E9%A6%96%E9%A1%B51.html" align="right">
<img border="0" src="D:\图片\图标.jpg"  align="right" width="70" height="40">
</a>
</p>
</body>
</html>

大三大四学习规划

<html>
<head><title>学习</title>
</head>
<body>
<h1 >大三</h1>
<font size="5">
<ul type="circle" >
<li>好好上课</li>
<li>按时完成编程作业</li>
</font>
</ul>
<h1>大四</h1>
<table border="1" width="500"><tr><th> 一 </th><td bgcolor="red">刷各种面试笔试题</td>
</tr>
<tr><th> 二 </th><td background="D:\图片\4.jpg">写一些项目</td>
</tr>
<tr><th> 三 </th><td>实习找工作</td>
</tr>
</table>
<form>
<br>
<a href="file:///C:/Users/90964/Desktop/%E9%A6%96%E9%A1%B51.html" >
<input type="button" value="返回首页">
</a>
</form>
</body>
</html>

我的家乡

<html>
<head><title>家乡</title>
</head>
<body>
<h1><center><font color="red" size="10">晋城</font></center></h1>
<font size="6">
<p>&nbsp&nbsp&nbsp&nbsp&nbsp晋城市，古称建兴、泽州、泽州府，是山西省辖地级市，位于山西省东南部，晋豫两省接壤处，全境居于晋城盆地，总面积9490平方公里，自古为兵家必争之地，<img src="D:\图片\晋城.jpg" alt=晋城  align=“middle”>素有“河东屏翰、中原咽喉、三晋门户”的美誉。 </p> <p>&nbsp&nbsp&nbsp&nbsp&nbsp晋城市是华夏文化发祥地之一，两万年前便留下高都遗址、塔水河、下川等人类遗址。是女娲补天、愚公移山、禹凿石门、商汤筹雨等神话发源地，高僧慧远、名将陈龟、名医王叔和、天文学家刘羲叟、李俊民、郝经、荆浩、贾鲁、陈卜、孔三传、张慎言、王国光、陈廷敬等名人故里。全市现有文物总量6767处，其中国家重点文保单位66处。包括冶底岱庙、青莲寺、崇寿寺、玉皇庙、阳阿古城、海会寺、开化寺、程颢书院、崇安寺、炎帝陵、柳氏民居以及湘峪古堡、天官王府、皇城相府、长平之战遗址群、羊头山石窟、中华名山析城山、太行至尊王莽岭等众多名胜古迹和自然遗产。
晋城市古为冶炼之都，有“九头十八匠”之称。是战国“阳阿古剑”产地，境内泽州铁器、兰花炭曾名扬海内 。蟒河、历山等保护区，生长有猕猴、大鲵等稀有动物，素有山西"生物资源宝库"之称。
晋城市是山西省中高档铸件、电力、畜牧业基地。二广、晋侯（阳翼）、陵沁、环城高速与207国道交织成网，太焦、嘉南及侯月铁路贯穿全境，拥有国家森林城市、国家园林城市等多项荣誉
</font>
<form>
<br>
<a href="file:///C:/Users/90964/Desktop/%E9%A6%96%E9%A1%B51.html" >
<input type="button" value="返回首页">
</a>
</form>
</body>
</html>

我的故事

<html>
<head><title>故事</title>
</head>
<body>
<h1>我的故事由你书写</h1>
<form action="file:///C:/Users/90964/Desktop/%E6%88%91%E7%9A%84%E6%95%85%E4%BA%8B.html">
性名： <input type="text" name="性名">
<br>
性别：<select name="性别"><option value="男">男<option><option  value="女">女<option></select>
<br>
想说的话：<textarea rows="10" cols="30"></textarea>
<input type="submit" value="Submit">
</form>
<br>
<a href="file:///C:/Users/90964/Desktop/%E9%A6%96%E9%A1%B51.html" align="right">
<img border="0" src="D:\图片\图标.jpg"  align="right" width="70" height="40">
</a>
</body>
</html>

希望大家批评和指正，第一次写有很多需要完善的地方，希望以后会越做越精美。

使用html制作个人主页相关推荐

Matlab制作个人主页
Matlab代码编辑器具有代码发布功能,如下图,当编辑好代码后,点击Publish按钮可以发布html网页格式的代码使用说明. 从上面的图中可以看到,发布功能可以控制字体(黑体.斜体.等宽字体),添加 ...
用html制作个人站点,【制作个人网站】如何在网上制作自己的网页?如何用html5制作个人主页?制作个人网页设计思路是怎样的?...
[制作个人网站]如何在网上制作自己的网页?如何用html5制作个人主页?制作个人网页设计思路是怎样的?下面就和小编一起来看看吧! 如何在网上制作自己的网页? 网站设计的八个步骤现在看到的工具越来越多, ...
用html5来制作个人主页
用html+css+js来制作个人主页,锻炼自己的个人制作能力,简单上手好操作页面分为几个页面,用到了选项卡个人技术不是太过关,背景音乐做的并不是非常的好源码在: https://pan.bai ...
用php编写的简单个人主页,如何制作个人主页
由个人或单个团体创建.管理的网站页面.其目的在于展示.表达创建人或团体对于某事物的见解或意见.看法.由于实际需求如求职.发布消息.公布通告等. 所谓的个人网页,就是指网页内容是介绍自己的或是以自己的信 ...
HTML制作个人主页
浏览器中书签放不下了.很多重要网址需要记录下来.可能经常会用到,可以做一个个人主页的html页面放在首页.由于是本地网页所以响应速度很快几乎是秒开: 代码如下: <!DOCTYPE html ...
html 制作个人主页,html ------个人主页制作示例（div布局）
该楼层疑似违规已被系统折叠隐藏此楼查看此楼 .header{width:1000px;margin-left:auto;margin-right:auto;padding-top:20px;} .h ...
利用Google Sites制作个人主页
第一步:注册 google sites,然后create site,选择template,template内容最好只有home一个page,方便后面的site layout. 第二步:create n ...
使用HTML+CSS制作个人主页
参考原型参考的原型是: 确定页面结构确定样式上传到GitHub Pages 预览效果: 转载于:https://www.cnblogs.com/wangjian2016/p/7247479.ht ...
【保姆级教程】手把手教你用github制作学术个人主页（学者必备）
很多朋友到了本科生或者研究生或者博士生的高年级,有了制作个人主页的需求,今天这一期博客将以academicpages模板为例,手把手教你快速制作一个简洁能用的个人主页. 1.首先你需要拥有一个gith ...

使用html制作个人主页

进入正题

首页

我的相册

大三大四学习规划

我的家乡

我的故事

代码

使用html制作个人主页相关推荐

最新文章

热门文章