HTML-day1[一些基本标签使用]

html:

超文本标记语言(hyper text markup language  简称HTML)是一种用于创建网页的标准标记语言。HTML是一种基础技术,常与CSS、JavaScript一起被众多网站用于设计网页、网页应用程序以及移动应用程序的用户界面。网页浏览器可以读取HTML文件,并将其渲染成可视化网页。HTML描述了一个网站的结构语义随着线索的呈现,使之成为一种标记语言而非编程语言。

<!DOCTYPE html>
<html>
   <head>
     <title>这是标题</title>
   </head>
   <body>
    <p>Hello world!</p>
   </body>
</html>

　　<html>和</html>之间的文本描述网页,<body>和</body>之间的文本为可视页面内容。标记文本<title>这是标题</title>定义了浏览器的页面标题。

　　文档标记类型<!DOCTYPE html>用于HTML5。如果未进行声明,浏览器会使用怪异模式进行渲染。

示例:

　　具体效果可以访问:http://67.209.178.158/查看

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">    <!--声明字符集-->
        <meta name="keywords" content="Test page,Test html,html">  <!--自定义关键字,主要是针对搜索引擎搜寻-->
        <meta name="description" content="This is my html Test Page">  <!--网页描述,简介-->
        <meta http-equiv="content-type" charset="utf-8">   <!--声明字符集,跟上面的一样的-->
        <title>Test Page</title>    <!--网页页面标题-->
        <link rel="icon" href="test_icon.jpg">   <!--网页标签图标-->
    </head>
    <body bgcolor="white">   <!--自定义的背景颜色-->
        <h1 align="center">这是一个html测试页面,欢迎你!</h1>    <!--标题 H1-H6 分为六级-->
        <h2>段落测试部分</h2>
        <p>这是第一个段落</p>
        <h3>链接测试部分</h3>
        <a href="http://www.cnblogs.com/ldsly" target="_blank">我的博客</a>
        <h4>文本测试部分</h4>
        <b>加粗显示</b>
        <strike>为文字加上中线</strike>
        <em>文字变斜</em>
        上角标<sup>角标</sup>
        下角标<sub>角标</sub>
        <br/>换行显示,下方是水平线<br/>
        <hr>
        <h5>符号测试</h5>
        &lt; &gt；&quot；&copy;&reg;<br/>
        <a target="_blank" href="http://www.cnblogs.com/web-d/archive/2010/04/16/1713298.html">符号参考</a><br/>
        版权所有[测试]<sup>&copy;</sup>Gldsly[测试]<sup>&reg;</sup>
        <h6>图片测试</h6>
        <img src="test_icon.jpg" alt="加载失败" title="网页标签图标">
        <hr>
        <h3 align="center">下面是列表测试</h3>
        <p>这是无序列表</p>
        <ul>
            <li>第一行</li>
            <li>第二行</li>
            <li>第三行</li>
        </ul>
        <p>这是有序列表</p>
        <ol>
            <li>第一行</li>
            <li>第二行</li>
            <li>第三行</li>
        </ol>
        <p>这是定义列表</p>
        <dl>
            <dt>标题</dt>
            <dd>第一行</dd>
            <dd>第二行</dd>
            <dd>第三行</dd>
        </dl>
        <hr>
        <h3 align="center">下面是表格测试</h3>
        <table width="400">
            <tr>
                <th colspan="8">课程表</th>
            </tr>
        </table>
        <table border="1" cellspacing="2px" cellpadding="2">
            <tr>
                <th>项目</th>
                <th colspan="5">上课</th>
                <th colspan="2">休息</th>
            </tr>
            <tr>
                <th>星期</th>
                <th>星期一</th>
                <th>星期二</th>
                <th>星期三</th>
                <th>星期四</th>
                <th>星期五</th>
                <th>星期六</th>
                <th>星期日</th>
            </tr>
            <tr>
                <td rowspan="4">上午</td>
                <td>语文</td>
                <td>数学</td>
                <td>英语</td>
                <td>英语</td>
                <td>物理</td>
                <td>计算机</td>
                <td rowspan="4">休息</td>
            </tr>
            <tr>
                <td>数学</td>
                <td>数学</td>
                <td>地理</td>
                <td>历史</td>
                <td>化学</td>
                <td>计算机</td>
            </tr>
            <tr>
                <td>化学</td>
                <td>语文</td>
                <td>体育</td>
                <td>计算机</td>
                <td>英语</td>
                <td>计算机</td>
            </tr>
            <tr>
                <td>政治</td>
                <td>英语</td>
                <td>体育</td>
                <td>历史</td>
                <td>地理</td>
                <td>计算机</td>
            </tr>
            <tr>
                <td rowspan="2">下午</td>
                <td>语文</td>
                <td>数学</td>
                <td>英语</td>
                <td>英语</td>
                <td>物理</td>
                <td>计算机</td>
                <td rowspan="2">休息</td>
            </tr>
            <tr>
                <td>数学</td>
                <td>数学</td>
                <td>地理</td>
                <td>历史</td>
                <td>化学</td>
                <td>计算机</td>
            </tr>
        </table>
        <hr>
        <table border="1" cellspacing="0px">
            <tr>
                <th colspan="3">星期一菜谱</th>
            </tr>
            <tr>
                <td rowspan="2">素菜</td>
                <td>青菜茄子</td>
                <td>花椒扁豆</td>
            </tr>
            <tr>
                <td>小葱豆腐</td>
                <td>炒白菜</td>
            </tr>
            <tr>
                <td rowspan="2">荤菜</td>
                <td>油焖大虾</td>
                <td>海参鱼翅</td>
            </tr>
            <tr>
                <td>红烧肉<img src="http://image5.huangye88.com/2013/01/18/62698287f1e7e7d3.jpg"></td>
                <td>烤全羊</td>
            </tr>
        </table>
        <hr>
        <h3>下面是from测试</h3>
        <from action="">
                <p>用户:<input type="text"></p>
                <p>密码:<input type="password"></p>
                <input type="submit" value="登录">
        </form>
    </body>
</html>

 

posted @ 2017-07-31 19:34  neuropathy_ldsly  阅读(167)  评论(0)    收藏  举报