HTML HTML基本语法

最新推荐文章于 2024-12-10 16:54:57 发布

LZ_Luzhuo

最新推荐文章于 2024-12-10 16:54:57 发布

阅读量2.7k

点赞数 27

分类专栏： html 文章标签： html 爬虫

本文链接：https://blog.youkuaiyun.com/Rozol/article/details/69941523

版权

html 专栏收录该内容

2 篇文章

订阅专栏

HTML HTML基本语法

本文由 Luzhuo 编写,转发请保留该信息.
原文: http://blog.youkuaiyun.com/Rozol/article/details/69941523

主要用于爬虫而写的html基本语法
基本语法页面效果
 Fame(框架)页面效果

基本语法

<!-- 声明 -->
<!DOCTYPE HTML>
<html>
    <!-- 头部分 -->
    <head>
        <!-- 标题标签 -->
        <title>标题标签</title>
        <!-- 网页属性 -->
        <!-- 修改页面的解析字符集 -->
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    </head>

    <!-- 正文部分 bgcolor:背景颜色 -->
    <body bgcolor="blue">
        <!-- 排版部分 -->
        <!-- br:换行 -->
        这是正文!</br>
        <!-- p:段落 -->
        <p>
        这是一个段落!
        </p>
        <!-- hr:水平线 -->
        <hr>

        <!-- 文字部分 -->
        <!-- h1-h6:标题 -->
        <h1>标题1</h1>
        <!-- 文字属性 size:1-7,默认3 color="#0000ff" -->
        这是一句<font color="red" size="7" face="黑体" >红色的7号黑体字</font>!<br/>
        <!-- 加粗 -->
        <b>加粗</b><br/>
        <!-- 上标 -->
        <sup>上</sup>标<br/>
        <!-- 下标 -->
        <sub>下</sub>标<br/>
        <!-- 斜体 -->
        <i>斜体</i><br/>
        <!-- 下划线 u / ins -->
        <u>下划线</u><br/>
        <!-- 删除线 -->
        <del>删除线</del><br/>
        <!-- 引用的缩进 -->
        <blockquote>引用的缩进</blockquote>
        <!-- 文本块 -->
        <pre>1 2  3   4   5
            文本块</pre>
        <!-- 代码块 -->
        <code>print ('Hello world!')</code>
        <hr>

        <!-- 转义字符部分 -->
        <!-- 空格 -->
        空&nbsp;格<br/>
        <!-- < > -->
        1&lt;5&gt;3<br/>
        <!-- & -->
        abc&amp;def<br/>
        <!-- " -->
        这是&quot;号<br/>
        <!-- © -->
        版权&copy;<br/>
        <!-- ® -->
        注册商标&reg;<br/>
        <!-- × -->
        乘号&times;
        <!-- ÷ -->
        除号&divide;
        <hr>

        <!-- 清单部分 -->
        <!-- 无序列表 type:disc:实心圆(默认) circle:空心圆 square:实心正方-->
        无序列表:
        <ul type="square" >
            <li>条目1</li>
            <li>条目2</li>
            <li>条目3</li>
        </ul>
        <!-- 无序列表 type:A / a / I / i / 1 -->
        无序列表:
        <ol type="I" start="10" >
            <li>条目1</li>
            <li>条目2</li>
            <li>条目3</li>
        </ol>
        <!-- 分类 -->
        <dl>
            <dt>分类1</dt>
                <dd>条目1a</dd>
                <dd>条目1b</dd>
                <dd>条目1c</dd>
            <dt>分类2</dt>
                <dd>条目2a</dd>
                <dd>条目2b</dd>
                <dd>条目2c</dd>
        </dl>
        <hr>

        <!-- 图形部分 -->
        <!-- 图片 border:边框 alt:加载失败文字 title:提示信息 align:对齐方式 top / middle / bottom / left / center / right -->
        <img src="logo.jpg" border="1" width="300" height="186" alt="哈哈" title="嘿嘿" />
        <hr>

        <!-- 链接部分 -->
        <!-- 本地链接  target="_blank":新页面打开 href: xxx.htm / http://xxx.com / mailto:xxxx@email.cn / thunder://xiazai -->
        <a href="Readme.html" target="_blank" >打开网页</a><br>
        <a href="Readme.html" target="_blank" ><img src="logo.jpg" width="300" height="186"/></a><br>
        <!-- 锚点链接 -->
        <a name="_top" ></a>
        <!-- 跳到某锚点 -->
        <a href="#_top" >回到顶部</a>
        <hr>

        <!-- 表格 border:边框 0/1 cellpadding:内边距(边框) cellspacing:外边距(边框) bgcolor="red":颜色背景-->
        <table border="1" width="500" cellspacing="5" bgcolor="red">
            <!-- tr:行 -->
            <tr>
                <!-- th表头(粗) -->
                <th>姓名</th>
                <th>年龄</th>
            </tr>
            <tr>
                <!-- td:列 align:center / left / right -->
                <!-- 如果某单元格没有内容,用&nbsp;(空格)占位-->
                <td align="center" >tom</td>
                <td>18</td>
            </tr>
            <tr>
                <!-- colspan="2" 水平对应; rowspan="2"垂直对应 -->
                <td colspan="2" >tom</td>
            </tr>
        </table>
        <hr>

        <!-- 表单(用于采集用户输入数据) -->
        <!-- action:提交路径 method:数据提交方式 -->
        <!-- GET: http://xxx.asp?yourname=xxx -->
        <form action="http://xxx.asp" method="get">
            <!-- 输入框 type:text / password -->
            <input type="text" name="yourname">
            <input type="submit" value="提交">
            <!-- 多行文本 cols:水平 rows:垂直 -->
            <textarea name="moretext" cols="50" rows="3"></textarea>
        </from>
    </body>
</html>

Fame(框架)

<!DOCTYPE HTML>
<html>
    <head>
        <title>框架</title>
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
    </head>
    <!-- rows:上下平分(%为平分比例) -->
    <frameset rows="30%,70%" >
        <frame src="css.html" /> 
        <!-- cols:水平平分 -->
        <frameset cols="30%,70%" >
                <frame src="Readme.html"  /> 
                <frame src="Base1.html" name="_dd"  /> 
        </frameset>
    </frameset>
</html>