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月前
|
前端开发 JavaScript 开发工具
【HTML/CSS】入门导学篇
【HTML/CSS】入门导学篇
48 0
|
3月前
|
存储 移动开发 前端开发
HTML新特性【HTML5内联SVG、SVG_矩形、SVG 与 Canvas两者间的区别 、HTML5_MathML 】(三)-全面详解(学习总结---从入门到深化)
HTML新特性【HTML5内联SVG、SVG_矩形、SVG 与 Canvas两者间的区别 、HTML5_MathML 】(三)-全面详解(学习总结---从入门到深化)
63 0
|
3天前
|
缓存 Java 应用服务中间件
SpringMVC入门到实战------七、SpringMVC创建JSP页面的详细过程+配置模板+实现页面跳转+配置Tomcat。JSP和HTML配置模板的差异对比(二)
这篇文章详细介绍了在SpringMVC中创建JSP页面的全过程,包括项目的创建、配置、Tomcat的设置,以及如何实现页面跳转和配置模板解析器,最后还对比了JSP和HTML模板解析的差异。
SpringMVC入门到实战------七、SpringMVC创建JSP页面的详细过程+配置模板+实现页面跳转+配置Tomcat。JSP和HTML配置模板的差异对比(二)
|
2月前
|
前端开发
HTML+CSS练习小项目——百叶窗
HTML+CSS练习小项目——百叶窗
|
2月前
杨老师课堂之网页制作HTML的学习入门-含有案例1
杨老师课堂之网页制作HTML的学习入门-含有案例
24 3
|
2月前
|
存储 移动开发 API
HTML5本地存储:从入门到精通
HTML5本地存储:从入门到精通
34 1
|
2月前
|
前端开发 JavaScript 容器
技术经验解读:个人练习:使用HTML+CSS3制作图片轮播功能(不使用JavaScript)
技术经验解读:个人练习:使用HTML+CSS3制作图片轮播功能(不使用JavaScript)
45 0
|
2月前
|
前端开发
前端基础学习(一)HTML入门
前端基础学习(一)HTML入门
21 0
前端基础学习(一)HTML入门
|
2月前
|
数据安全/隐私保护
杨老师课堂之网页制作HTML的学习入门-含有案例2
杨老师课堂之网页制作HTML的学习入门-含有案例
14 0