HTML学习笔记(一)

点击打开链接的学习总结。

HTML常用的标签及解释
1、基本格式框架
<html>
<body>
<h1>标题</h1>
<p>段落</p>
</body>
</html>

2、文本格式化标签
<b>粗体</b>
<big>大号字</big>
<em>着重字(粗)</em>
<i>斜体字</i>
<strong>加强语气(粗)</strong>
<sub>下标</sub>
<sup>上标</sup>
<ins>插入字</ins>
<del>删除字</del>

3、链接
<a href="URL" target="_blank"> this is a link </a>

其中,href=超链接,target="_blank"表示在新窗口打开文件。
注意,两者之间用空格。
有一种特殊情况是使用name属性,可以转跳到name属性定义的锚。
<a name="tips">基本的注意事项 - 有用的提示</a>
. . . <a href="#tips">跳转到tips标签处</a>

注意,引用锚时要在名字前面加#。

4、图像
<img src="boat.gif" alt="Big Boat" width="104" height="102" />
其中,src存放图片所在地址;
alt属性表示替换文本,即当图片不能加载是所显示的文字说明;
width和height用于设置图片的长度和宽度;
另外,图像还有一个属性border用于规定图像边框的宽度。

5、改变属性的通用方法——style
<body style="background-color:yellow">
<h2 style="font-family:arial;color:red;font-size:20px;text-align:center;">
标题
</h2>
</body>
其中,background-color用于设置背景颜色;
font-family用于设置字体;
color用于设置(标题)字体颜色;
font-size用于设置字体大小;
text-align:center居中。

6、引用
第一种:相当于“”。
<q>所要引用的话</q>

第二种:长引用,自动缩进,cite表示出处地址(可省略)。
<blockquote cite="URL">......</blockquote>

第三种:缩略词,鼠标放到缩略词上会显示完整内容,即title。
<abbr title="world health organization">WHO</abbr>
第四种:地址(联系信息),自动斜体,并且前后自动加换行。

<address>我是地址</address>

第五种:著作标题,自动斜体。
<cite>老人与海</cite>

特别的,双向重写,dir="rtl"为从右向左书写
<bdo dir="rtl">从右向左</bdo>

7、计算机代码
<kbd>键盘输入</kbd>
<samp>计算机输出示例</samp>
<code>代码</code>
<pre>文本</pre>
<var>数学公式</var>

其中,前三种均不保留空格和换行,如果要保持文本的原有格式,请使用第四种,<pre>保留换行。

8、创建图像映射
<html>
<body>

<p>请点击图像上的星球,把它们放大。</p>

<img
src="/i/eg_planets.jpg"
border="0" usemap="#planetmap"
alt="Planets" />

<map name="planetmap" id="planetmap">

<area
shape="circle"
coords="180,139,14"
href ="/example/html/venus.html"
target ="_blank"
alt="Venus" />

<area
shape="rect"
coords="0,0,110,260"
href ="/example/html/sun.html"
target ="_blank"
alt="Sun" />

</map>

</body>
</html>

其中,<map>定义图像地图,包括id和name属性,感觉一般情况下都要定义;
<area>定义图像地图的可点击区域,包含的属性:
            shape规定区域的形状
            coords规定区域的(x,y)坐标,左上角为(0,0);比如(x,y,z),xy表示圆心,z表示半径

<img>中的usemap属性引用map中的id或name属性。

9、其他

<br/>-------换行
<hr/>-------水平线

<!-- this is a comment -->---------注释

阅读更多
文章标签: HTML
下一篇PHP学习笔记(一)
想对作者说点什么? 我来说一句

html学习笔记

2015年05月31日 15KB 下载

html常用标签学习笔记

2018年04月01日 26KB 下载

HTML学习笔记

2017年07月31日 3KB 下载

HTML语言学习笔记

2011年06月29日 101KB 下载

个人html学习笔记 精华版

2009年05月27日 58KB 下载

HTML 学习笔记

2013年03月29日 68KB 下载

没有更多推荐了,返回首页

关闭
关闭