html标签的简单介绍和使用3

我会带着你远行 2022-08-03 08:44 188阅读 0赞

#### 1.列表 ####

<dl>                        
        <dt>hello world</dt>    
        <dd>hello java</dd>     
        <dd>hello html</dd>     
        <dd>hello css</dd>      
    </dl>

实际效果

hello world

hello java

hello html

hello css

#### 2.有序列表 ####

<ol type="t">               
        <li>hello world</li>    
        <li>hello java</li>
        <li>hello html</li>
        <li>hello css</li>
    </ol>

实际效果

1.  hello world
2.  hello java
3.  hello html
4.  hello css

type属性可选值1，a，i  
选择1后排序为数字（默认）；选择a为字母排序；选择i为i，ii，iii排序

#### 3.无序列表 ####

<ul type="t">               
        <li>hello world</li>    
        <li>hello java</li>
        <li>hello html</li>
        <li>hello css</li>
    </ul>

实际效果

*  hello world
 *  hello java
 *  hello html
 *  hello css

type属性可选值空心圆circle，实心圆disc(默认)，实心方块square

#### 4.头标签 ####

head标签中包含的标签

例如如果不想在body中设置超链接时每次都手动的添加打开一个新的网站，就可以在head中加入如下语句,就能统一点击超链接的时候打开一个新网页了

#### 5.原样输出 ####

简单来说就是类似代码的文本放入网页时，其格式会遭到破坏，pre方法就是用来输出需要格式支持的文本的（刚才在markdown编辑器里尝试直接使用pre,结果发现就是编辑器里的代码行输出，原来markdown把pre标签换成了“\`，倒是挺吃惊的）

#### 6.表单中一些剩下的标签 ####

由于表单那一块还有一些遗留的标签，就一起放到这里了

其实这个应该放在上一次的文章里的，不小心漏掉了（ORZ）  
如果使用了文件上传，则需要在form标签中加上enctype属性

用图片来代替表单中的submit按钮

点击图片会和点击submit按钮产生一样的效果

在表单中添加普通按钮

可以和javaScript结合起来使用

#### 7.html中一些常用标签的汇总 ####

#### 8.框架标签 ####

框架标签能够实现将一个页面分为多个页面  
使用框架标签的时候需要将body标签去掉  
其主要的属性为

1.frameset
        -rows按照行进行划分
            <frameset rows="80,*"></frameset> 划分为2行，第一行高度为80，第二行填充满剩下的屏幕
        -cols按照列进行划分
            <frameset cols="80,*"></frameset> 划分为2列，左边一列宽度为80，右边一列填充满剩下的屏幕
    2.frame
        -具体显示的页面
            <frame name="name" src="x.html"/>

使用方法

<html>
        <head>
            <title>
                hello world
            </title>
        </head>
        <frameset cols="150,*">
            <frame name="left" src="1.html"/>
            <frame neme="right" src="2.html"/>
        </frameset>
    </html>

如上，页面将会被分为左右2半，左边只有150的宽度，左边载入的页面是1.html,右边载入的是2.html  
  
更多使用方式  
![这里写图片描述][20150804161000445]  
按照如上式样，就可以将一个页面分为无数个子页面了

如果现在一个页面被分为了左右2半，在左边中有一个超链接，假如想要点击超链接，让新页面展示在右边，则可以使用如下方法（假设左边页面的name属性为left）即可

[20150804161000445]: /images/20220731/7ce073e6b3ae4ebfa22ab8899dae0e3b.png