Html标签

来源:互联网 发布:各大国家的顶级域名 编辑:程序博客网 时间:2024/06/03 15:10

一、闭合和自闭合标签

1、闭合标签

文本使用闭合标签
<标签名>文件内容</标签名>

2、自闭合标签

引用内容使用自闭合标签
<标签名 />

二、块级元素和行内元素

1、块级元素

默认宽度和父元素同宽

2、行内元素
<html>    <head>        <meta charset="utf-8">        <title>文章的标题</title>        <style type="text/css">            /*为每个td和th都加上了边框,默认表格之间的边框是有空隙的*/            table tr td,th{border:1px solid #000;}          </style>    </head>    <body>        <!--html代码注释-->        <!--html显示的内容都在body内部编写-->        <!--hx标签,x的取值为1-6-->        <h1>标题标签</h1>        <!--利用div标签可以将页面划分成独立的栏目板块-->        <div>div标签</div>        <p>段落标签</p>         <em>强调标签斜体</em>        <strong>强调标签粗体</strong>        <span>span标签没有语义,是为了单独设置样式使用</span>        <q>这是一个短文本引用,内部的文字加上双引号</q>        <blockquote>这是一个长文本引用,内部的文字会缩进两个字符        </blockquote>        <!--空标签表示换行,img hr也是这样的标签-->        <br />        <!--用于添加分割线-->        <hr />        <!--img标签一般没有结束的'/'-->        <img src="myimage.gif" alt="图片加载不了时显示的内容" title="鼠标移动到图片上时显示的内容">        <!--添加空格-->        &nbsp;&nbsp;        <!--address标签,为网页加入地址信息,字体 为斜体-->        <address>北京邮电大学</address>        <!--code标签用于插入一行代码,多行代码不能使用,        多行代码可以使用pre标签-->        <code>var i=i+300;</code>        <!--列表标签没有顺序-->        <ul>            <li>列表1</li>            <li>列表2</li>            <li>列表3</li>        <ul>        <!--列表标签有顺序,默认都会带上数字序号-->        <ol>            <li>列表1</li>            <li>列表2</li>            <li>列表3</li>        </ol>        <table summary="表格的摘要内容不会显示">            <caption>表格的标题,居中显示在表格上方</caption>            <!--加上tbody之后整个表格加载完毕之后才会显示-->            <tbody>                <tr>                    <!--表格的表头,默认加粗居中-->                    <th>                    </th>                </tr>                <tr>                    <td>                    </td>                </tr>            </tbody>        </table>        <!--a标签的有默认样式,蓝色字体和下划线-->        <a href="网址" title="鼠标滑过时显示的内容">显示的文本</a>        <!--在新的窗口中打开链接-->        <a href="网址" target="_blank">显示的文本</a>        <!--mailto的使用-->        <a href="mailto:meicx@bupt.edu.cn?cc=test@bupt.edu.cn&bcc=bupt@bupt.edu.cn&subject=主题&body=邮件内容">发送</a>        <!--<form method="表单提交方式" action="提交的地址">-->        <form method="post" action="save.php">            <!--for的内容为label标签关联的input标签的id-->            <label for="username">用户名:</label>            <input type="text" name="username" />            <label for="pass">密码:</label>            <!--密码输入框-->            <input type="password" name="pass" />            <!--textarea支持多行文本输入,cols代表列数,rows代表行数,            也可以使用width和height代替这两个属性-->            <textarea cols="50" rows="10">            </textarea>            <!--单选框和复选框-->            <!--需要保证name的名字相同,value的值是传给服务端的值-->            <input type="radio/checkbox" name="name" value="值"            checked="checked" />            <!--下拉框,可以实现单选和多选,在select标签中添加muliple属性-->            <!--value为向服务器提交的值,闭合标签之间为显示的值-->            <label>爱好:</label>            <select multiple="multiple">                <option value="读书" selected="selected">读书</option>                <option value="运动">运动</option>                <option value="音乐">音乐</option>            </select>            <!--由于input标签是自闭合的标签,因此value是显示的内容-->            <input type="submit" value="提交" name="submitBtn" />            <!--重置标签可以将列表中表单的值变为初始的值-->            <input type="reset" value="重置" name="resetBtn" />        </form>    </body></html>

mailto的参数
这里写图片描述

0 0
原创粉丝点击