Html入门练习

简介: Html入门练习

开始学些Html的时候主要进行一些简单的静态网页的处理:

1、HTML 标题

HTML 标题(Heading)是通过 h1-h6 加中括号<>等标签进行定义的。

2、HTML 段落

HTML 段落是通过


标签进行定义的。

3、HTML 链接

HTML 链接是通过《a》标签进行定义的。

4、HTML 图像

HTML 图像是通过 标签进行定义的。

5、HTML 元素

HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。

6、HTML 元素语法

a、HTML 元素以开始标签起始

b、 HTML 元素以结束标签终止

c、 元素的内容是开始标签与结束标签之间的内容

d、 某些 HTML 元素具有空内容(empty content)

e、 空元素在开始标签中进行关闭(以开始标签的结束而结束)

f、 大多数 HTML 元素可拥有属性

下面是我自己参照着练习的代码:

</head>
</html>
<h1 align="center">相信未来</h1>
<head>
<html lang = "en">
<meta charset="UTF-8">
<body bgcolor="yellow">
<body>
当蜘蛛网无情地查封了我的炉台<br />
当灰烬的余烟叹息着贫困的悲哀<br />
我依然固执地铺平失望的灰烬<br />
用美丽的雪花写下:相信未来<br />
<hr />
当我的紫葡萄化为深秋的露水<br />
当我的鲜花依偎在别人的情怀<br />
我依然固执地用凝霜的枯藤<br />
在凄凉的大地上写下:相信未来<br />
<hr />
我要用手指那涌向天边的排浪<br />
我要用手掌那托住太阳的大海<br />
摇曳着曙光那枝温暖漂亮的笔杆<br />
用孩子的笔体写下:相信未来<br />
<hr />
我之所以坚定地相信未来<br />
是我相信未来人们的眼睛<br />
她有拨开历史风尘的睫毛<br />
她有看透岁月篇章的瞳孔<br />
不管人们对于我们腐烂的皮肉<br />
那些迷途的惆怅、失败的苦痛<br />
是寄予感动的热泪、深切的同情<br />
还是给以轻蔑的微笑、辛辣的嘲讽<br />
我坚信人们对于我们的脊骨<br />
那无数次的探索、迷途、失败和成功<br />
一定会给予热情、客观、公正的评定<br />
是的,我焦急地等待着他们的评定<br />
<hr />
朋友,坚定地相信未来吧<br />
相信不屈不挠的努力<br />
相信战胜死亡的年轻<br />
相信未来、热爱生命<br />
<hr />
<a href="http://blog.csdn.net/u011046042/article/details/73826432">
<img border="0" src="C:\Users\Administrator\Desktop\QQ截图20170628160016.jpg" />
</a>
<img src="C:\Users\Administrator\Desktop\1.gif" width="300" height="200" align="right"/> <br />
<a href="http://blog.csdn.net/u011046042/article/details/73824333">
 Altium Designer 画原理图时找不到 信号发生器</a>
<p>请点击图像上的星球,把它们放大。</p>
<img
src="C:\Users\Administrator\Desktop\QQ截图20170628163209.jpg"
border="0" usemap="#planetmap"
alt="Planets" />
<map name="planetmap" id="planetmap">
<area
shape="circle"
coords="180,139,14"
href ="/example/html/mercur.html"
target ="_blank"
alt="Venus" />
<area
shape="circle"
coords="129,161,10"
href ="/example/html/mercur.html"
target ="_blank"
alt="Mercury" />
<area
shape="rect"
coords="0,0,110,260"
href ="/example/html/mercur.html"
target ="_blank"
alt="Sun" />
</map>
<p>请把鼠标移动到图像上,看一下状态栏的坐标如何变化。</p>
<a href="/example/html/html_ismap.html">
<img src="C:\Users\Administrator\Desktop\QQ截图20170628163209.jpg" ismap />
</a>
<p><b>注释:</b>img 元素中的 "usemap" 属性引用 map 元素中的 "id" 或 "name" 属性(根据浏览器),所以我们同时向 map 元素添加了 "id" 和 "name" 属性。</p>
<table border="1">
<tr>
<td>姓名, 性别</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>人数, 成绩</td>
<td>row 2, cell 2</td>
</tr>
</table>
 </body>

运行的效果如下:

相关文章
|
3月前
|
前端开发 程序员
【前端web入门第二天】01 html语法实现列表与表格_合并单元格
本文介绍了HTML中的列表与表格的使用方法。列表包括无序列表(`&lt;ul&gt;`嵌套`&lt;li&gt;`)、有序列表(`&lt;ol&gt;`嵌套`&lt;li&gt;`)和定义列表(`&lt;dl&gt;`嵌套`&lt;dt&gt;`和`&lt;dd&gt;`)。
70 19
|
3月前
|
前端开发 Windows
【前端web入门第一天】02 HTML图片标签 超链接标签 音频标签 视频标签
本文档详细介绍了HTML中的图片、超链接、音频和视频标签的使用方法。首先讲解了`&lt;img&gt;`标签的基本用法及其属性,包括如何使用相对路径和绝对路径。接着介绍了`&lt;a&gt;`标签,用于创建超链接,并展示了如何设置目标页面打开方式。最后,文档还涵盖了如何在网页中嵌入音频和视频文件,包括简化写法及常用属性。
60 13
|
2月前
|
移动开发 前端开发 JavaScript
HTML入门(详细)
HTML入门(详细)
29 0
|
3月前
|
前端开发 程序员 C++
【前端web入门第一天】01 开发环境、HTML基本语法文本标签
本文档详细介绍了HTML文本标签的基础知识。首先指导如何准备开发环境,包括安装VSCode及常用插件;接着全面解析HTML的基本结构与标签语法,涵盖从基本骨架搭建到注释的使用,以及标题、段落、换行和平行线、文本格式化等标签的具体应用,适合初学者循序渐进地掌握HTML。
|
4月前
|
缓存 Java 应用服务中间件
SpringMVC入门到实战------七、SpringMVC创建JSP页面的详细过程+配置模板+实现页面跳转+配置Tomcat。JSP和HTML配置模板的差异对比(二)
这篇文章详细介绍了在SpringMVC中创建JSP页面的全过程,包括项目的创建、配置、Tomcat的设置,以及如何实现页面跳转和配置模板解析器,最后还对比了JSP和HTML模板解析的差异。
SpringMVC入门到实战------七、SpringMVC创建JSP页面的详细过程+配置模板+实现页面跳转+配置Tomcat。JSP和HTML配置模板的差异对比(二)
|
4月前
|
移动开发 开发者 HTML5
构建你的首个个人网站:HTML基础入门
【8月更文挑战第29天】在数字化时代,拥有一个个人网站是展示自我、分享知识和技能的窗口。本文将引导你通过简单的步骤,使用HTML构建你的第一个个人网站。我们将探索HTML的基础标签,页面结构,以及如何将这些元素融合在一起创建一个简单的网页。无论你是编程新手还是希望扩展你的技术工具箱,这篇文章都提供了一条清晰的路径,帮助你开始你的网站开发之旅。
|
6月前
|
前端开发
HTML+CSS练习小项目——百叶窗
HTML+CSS练习小项目——百叶窗
|
6月前
杨老师课堂之网页制作HTML的学习入门-含有案例1
杨老师课堂之网页制作HTML的学习入门-含有案例
46 3
|
6月前
|
存储 移动开发 API
HTML5本地存储:从入门到精通
HTML5本地存储:从入门到精通
82 1
|
6月前
|
前端开发
前端基础学习(一)HTML入门
前端基础学习(一)HTML入门
35 0
前端基础学习(一)HTML入门
下一篇
DataWorks