HTML标签

最新推荐文章于 2023-04-22 01:03:27 发布

苏柳凝烟

最新推荐文章于 2023-04-22 01:03:27 发布

阅读量393

点赞数

分类专栏： HTML标签

本文链接：https://blog.csdn.net/slny1921394421/article/details/51960020

版权

HTML标签专栏收录该内容

3 篇文章 0 订阅

订阅专栏

html 语言就是开发网页的基础语言

html(超文本标记语言)

标记 : 该门语言是有标签来构成的。 学习html不用怎么去理解，只要需要记住标签的作用即可。

html语言的特点：

1.html语言是与平台无关的，任何平台只需要安装了浏览器都可以运行。
2.html 是不区分大小写的。

html语言的结构：

<html>html语言的根标签.

    <head></head> 网页的头信息

    <body></body> 网页的体部分

</html>

html的注释

记事本开发第一个html

<FONT size="30" color="red">这个是我的第一个网页</FONT>

html开发工具介绍

1、头信息的介绍

<html>
<!-- 头信息的作用
    1. 可以设置网页的标题。
    2. 可以通知浏览使用指定的码表解释html页面.
    3. seo(搜索引擎优化)

 -->
    <head>
        <meta http-equiv="content-type" content="text/html;charset=utf-8" />
        <title>这个是我的第一个网页</title>
        <meta name="keywords" content="java培训,php培训,C#培训，羊肉、狗肉、猪肉"/><!--一个网页的关键字最好是3-4个。 seo(搜索引擎优化)                          -->
    </head>

    <!-- 网页的内容应该写在body标签体内的。 -->
    <body>
        今天天气不错...
    </body>
</html>

2、常用的标签

<h1>~<h6> 表示是一个标题
<p>   段落标签
<hr/>  水平线标签
<br/>  换行标签
<sub>  下标
<sup>  上标
<pre>  原样标签： 原样标签会保留空格和换行符。
<ol> <li> 有序的列表标签、
<ul> <li> 无序的列表标签。
项目列表标签(dl dt dd)
行内标签(span)     
块标签<div>    div标签的内容会独立占一行。

* 标签的类型
*
1. 有开始标签与结束标签。

需要把网页的数据内容封装到标签中。
2. 开始标签与结束标签都是在一个标签体内的。比如：

功能单一不需要封装数据到标签中。

实体标签

为什么要学实体标签：
    因为> < 等一些符号在html页面中是有着特殊含义，这些字符如果需要在页面中显示，这时候就应该使用实体标签。


常用的实体字符: 
    空格      &nbsp;
    小于号     &lt;
    大于号    &gt;
-----------------------------
    人民币    &yen；
    版权      &copy;
    商标      &reg;

媒体标签

    <embed></embed>  
        hidden ： 设置隐藏插件是否隐藏。
        src ：用于指定音乐的路径

   <embed src="1.mp3" ></embed>

   <marquee> 飘动标签
        direction : 指定飘动的方向
        scrollamount : 指定飘动的速度。
        loop   :指定飘动的次数

    -->

   <marquee  loop="-1" scrollamount="30" direction="right"><font size="+6" color="red"> 我飞起来了...</font></marquee>

超链接标签

 <a> 超链接标签

 a标签常用的属性：
    href  : 用于指定链接的资源
    target: 设置打开新资源的目标。    _Blank 在独立的窗口上打开新资源   _self 在当前窗口打开新资源

超链接标签的作用：

1. 可以用于链接资源。
2. 锚点点位.  
    1. 首先编写一个锚点  锚点的格式： <a name="锚点名字"> 数据</a>
    2. 使用a标签 的herf属性连接到锚点出。  href=”#锚点的名字“

示例：

百度
 带你去看1.html

顶部

回到顶部

file: file协议（文件协议）这种协议主要是用于搜索本地机器的资源文件的。

格式：

图片标签

img标签常用的属性:
    width： 设置图片宽度
    height  设置图片高度    
    alt:    如果图片资源无法找到，那么就显示对应的文字对图片进行说明。

<img  src="11.jpg"  alt="这个是路飞" width="400" height="300" border="0" />

表格标签

表格使用到的标签：
    <table> 表格
    <tr>    行
    <td>    单元格
    <th>     表头   默认的样式是居中，加粗。
    <caption>  表格的标题        

表格常用的属性：
    border  设置表格的边框 
    width : 设置表格的宽度
    height: 设置表格的高度的。
    colspan: 设置单元格占据指定的列数。
    rowspan : 设置单元格占据指定的行数。



<table align="center" border="1px" bordercolor="#0066CC" width="400px" height="300px">
    <caption>期末考试成绩表</caption>

    <thead>
        <tr>
            <th>姓名</th>
            <th>分数</th>
            <th>人品</th>
        </tr>
    </thead>  

    <tbody>
    <tr>
        <td rowspan="2">许嵩</td>
        <td>98</td>
        <td>优</td>
    </tr>   
    <tr>    
        <td>100</td>
        <td>优</td>
    </tr>        
    <tr>
        <td>刘同</td>
        <td>99</td>
        <td>非常好</td>
    </tr>
        <tr align="center">
            <td>综合测评</td>
            <td colspan="2">97古惑仔</td>
        </tr>
     </tbody>