初学html

       前两天刚接触了html,我挺喜欢的,在课上,我学到了许多东西,现在我来回顾一下。

html是超文本标记语言,主要组成部分是标签,使用标记(标签)来描述网页,html文档也叫做web页面,基本标签有文字标签,段落标签,图片标签和列表标签,链接标签等等。

       通过学习我掌握了文字标签中的,知道的怎样去展示出想要的字体,想要的颜色,想要的效果等等。通过学习运用基本标签我们能够看到许多的漂亮的页面,下来就展示一下吧!

    每一个html都必须是有头有尾的:即<head></head>、<body></body>。

1、首先是写标题:注意,标题标签是成对出现的,即是全闭合标签

     类似的有很多,例如,段落标签<p></p>、字符格式化标签(加粗<b></b>、倾斜<i></i>、下划线<u></u>、删除符号<s></s>等)

     标题<title></title>在头<head></head>的里面;  

想要实现在标题前面加个小图标,可在标题里面运用定义文档与外部资源关系的标签<link>来实现的。(注意<link>标签是在</title>之后的,并且小图标的后缀必须是以.ico结尾的,得到.ico结尾的图标有很多种,例如,可以在网站上下载转换,可以用专业的制作小图标的软件制作,也可以用Photoshop制作,不过用PS做的时候需要注意,软件首先得有ico插件,并且大小必须为256px*256px)

(<link>标签是半闭合标签,类似的很多,例如,换行标签<br/>、分割线标签<hr/>、插图像<img/>等。)

2.头完了,接下来就是核心了,用标签<body></body>,想要使页面背景不是单一的白色,可以用body的bgcolor属性使其从白色变道自己喜欢的颜色。

     再来,就是文本展示:

·        首先是段落段落标签<p></p>,段落标签有自动换行的作用且与上下段有一定的间隔。想变换文字的大小颜色可以使用<font></font>的属性。

·        想要实现在每一段之前空两格可以使用<style></style>,即<style type="text/css">p{text-indent:2em}</style>

·        <h1></h1>......<h6></h6>的特点是:自动加粗变大字体,且带有换行的效果,从1到6字体逐渐变小。

·        加粗<b></b>、倾斜<i></i>、下划线<u></u>、删除符号<s></s>。

·        预先格式化<pre></pre>,特点是:格式不发生改变,会保留原来的空格和换行,但在<p></p>中是无法作用的,但在在HTML中最好用特殊符号&It代表“<”,&gt代表“>”,&amp代表“&”。

特殊符号

·        列表标签:无序列表<ul></ul>,有序列表<ol></ol>。<li></li>、<dd></dd>、<dt></dt>在有序和无序列表中是通用的。<dt></dt>顶格<dd></dt>空两格。

·        文本中有时会出现需要分隔的地方,因此就会有分割线<hr/>,可设置align和width等其他属性。

3.文中需要插入图像时,就需要图像标签<img/>

·        相对路径:.当前目录..返回上一级目录。<imgsrc="../../images/bg_1.jpg"alt="照片">

·        绝对路径:<imgsrc="位置\bg_1.jpg"/>

·        可在图片上设置热区,即图片热区:热区形状有可设置三种:矩形、圆以及自定义多边行。

<img src="../位置/bg_1.jpg" alt="照片" border="0" usemap="#Map"/>

<map name="Map">

<area shape="rect" coords="246,41,375,254"href="http://www.baidu.com">

<area shape="circle" coords="567,188,89"href="http://www.souhu.com">

<area shape="poly"coords="63,44,41,119,101,200,140,77" href="http://g.cn">

</map>

4.超链接:网页跳转:<a href=”链接或网址 本地文件”>描述文字</a>

   跳到外网:前面必有https://

   跳到本地:只需写文件名    (<a href="#aa">16</a>文件名前须有#)

   锚点:在本页面跳转

附:小图标网站    http://www.bitbug.net/

猜你喜欢

转载自blog.csdn.net/Jennifering/article/details/80199608