HTML 基础（一）

最新推荐文章于 2022-04-08 16:10:13 发布

coderdr31

最新推荐文章于 2022-04-08 16:10:13 发布

阅读量558

点赞数

分类专栏： HTML

本文链接：https://blog.csdn.net/banana_baba/article/details/50513888

版权

HTML 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

基本

*

    <!DOCTYPE html>  //声明是html5
        <h1>标题1</h1>
        <h2>22</h2>
        <p>hello0</p>    <!-- 段落 一段 -->
        <a href="http://write.blog.csdn.net/mdeditor">点击链接</a>
        <img src="" alt = "">
        hello1 <br />     <!-- 换行 -->
        hello2

属性

    <body bgcolor="#8b000">
        <h1 align="center">标题1</h1>
        <h2 class="h2ID">biao2</h2>     <!-- id -->

样式表插入链接图片插入

块

链接，图片

    <a href="http://write.blog.csdn.net/mdeditor">   <!-- 页外跳转 -->
    <img src="2.png">
    </a>

    <a name="tip1"> helloww</a>
    <a href="#tip1"> 跳转到helloww</a>  <!-- 页内跳转 -->

表格列表

<body>
    <table border="10">
        <caption> 标题</caption>
        <tr>
            <th> 单元</th>          <!-- 表头 -->
        </tr>
        <tr>                         <!-- 行 -->
            <td> 单元格1</td>
        </tr>
    </table>
另外
<table cellpadding="10"<!-- 边距 -->>
    <tr>
        <td>列1</td>
        <td>列2</td>
    </tr>
    <tr>
        <td>
            <li>a</li>
            <li>c</li>
            <li>b</li>
        </td>
        <td>
            haha
        </td>
    </tr>
</table>

列表

有序
嵌套
无序
嵌套
自定义
+ +

html布局

div布局

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>div布局</title>
    <style type="text/css">
        body{
            margin : 0px;       /*旁边不留白*/
        }
        div#container{
            width: 950px;
            height: 950px;
            background-color : #C0C0C0;
        }
        div#heading{
            width: 950px;
            height: 10%;
            background-color : aqua ;
        }
        div#contain_meun{
            width: 30%;
            height: 80%;
            background-color : aquamarine;
            float:left;       /*浮动*/
        }
    </style>
</head>
<body>
    <div id = "container">
        <div id = "heading">头部</div>
        <div id = "contain_meun">内容菜单</div>
        <div id = "contain_body">内容主体</div>
        <div id = "footing">底部</div>
    </div>
</body>
</html>

table布局

colspan = “3” 合并3个单元格

html表单

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <form>
    <input type="">     <!-- 复选框 单选按钮 按钮 -->
    <select>            <!-- 下拉菜单 -->
        <option></option>
    </select>
    </form>
</body>
    <textarea></textarea>       <!-- 文本框 -->
</html>

html表单与php交互

初级

把php文件放在 E:\xampp\htdocs 下

<body>
    <form action="http://localhost:8081/service.php" method="get">
    <input type="submit" value ="提交">
    </form>
</body>

html框架

<frameset></frameset>   <!-- 不在body中，已废弃 -->
<iframe src=""></iframe>

html实体

html实体有些符号展现不出来，用html实体代替