HTML的学习

学习HTML基础知识

~之标签学习

  1. 超链接
//一个例子,链接到百度首页
<a href="https://www.baidu.com/">百度</a>
//图片链接
<p>创建图片链接:
<a href="//www.runoob.com/html/html-tutorial.html">
<img  border="10" src="smiley.gif" alt="66" width="32" height="32"></a></p>

<p>无边框的图片链接:
<a href="//www.runoob.com/html/html-tutorial.html">
<img border="0" src="smiley.gif" alt="66" width="32" height="32"></a></p>
  1. 样式–style
//设置各种背景样式
<body style="background-color:yellow;"> //整张网页背景
<h2 style="background-color:red;">标题行背景</h2>
<p style="background-color:green;">段落背景</p>
</body>
  1. 插入水平线
//hr标签
<p>hr 标签定义水平线</p>
	<hr />
	<p>第一段66</p>
	<hr />
	<p>第二段77</p>
	<hr />
	<p>第三段88</p>
  1. 插入图片-img
//一个例子,“/images/logo.png”插入图片的地址,图片宽度258,高度:39
<img src="/images/logo.png" width="258" height="39" />
  1. 下划线与删除线
//一个例子,del标签是删除线,ins标签是下划线
<p>My favorite color is <del>blue</del> <ins>red</ins>!</p>
  1. 图像映射
//一个图像映射例子
<p>点击太阳或其他行星,注意变化:</p>

<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">
  <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">
  <area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>
  1. 插入表格
//一个例子,插入带标题的表格,tr是行标签,th是表头标签,td列标签
<table border="1">
  <caption>表格标题</caption>
  <tr>
    <th>列名1</th>
    <th>列名2</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$50</td>
  </tr>
</table>
  1. 插入文本域
//文本域
<form action="">
First name: <input type="text" name="firstname"><br>
</form>
  1. 插入密码域
//文本域
<form action="">
用户名: <input type="text" name="user"><br>
密码: <input type="password" name="password">
</form>

小编的第一篇文章,很简单的内容,希望各位博友多多关照!

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值