h5-lesson1

来源：互联网发布：2016志鸿优化设计答案编辑：程序博客网时间：2024/04/29 21:18

一、标签
标题： <h1></h1>
段落： <p> </p>
链接跳转：<a href="https：www.baidu.com"></a>
图片链接：<img src="**/*.png">
二、样式、链接、表格
1.样式

<head>    <meta charset="UTF-8">    <title>样式</title>    <link rel="stylesheet" type="text/css" href="mystyle.css">    <style type="text/css">        p{            color:aqua;        }    </style></head><body>    <h1>标题h1</h1>    <p>好好学习天天向上</p>    <a href="http://www.baidu.com" style="color:antiquewhite">点击我跳转</a></body></html>

样式控制一般放在head中，方便管理和修改，样式分为：外部样式表、内部样式表、内联样式表
1.1其中<link>为外部样式表：rel指明为外部样式，type指明引用的是css,href是地址
而mystyle。css中的内容为如下（简单的对h1的颜色控制）：

h1{    color:red;}

1.2<style></style>为内部样式表，type为使用的是css，

 p{            color:aqua;        }

是对<p></p>的颜色控制控制
1.3<a></a>中的style是内联样式表，style=”color:antiquewhite”，是对其颜色进行控制
2.链接

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>链接</title></head><body>    <a href="https://www.baidu.com">点击我</a><!--跳转-->    <br/>    <a href="https://www.baidu.com">        <img src="images/望京.png" width="200px" height="200px" alt="html5logo"> <!--图片跳转-->    </a>    <br/>    <a name="tips">hhh</a> <!--与下方#tips构成内部跳转-->    <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>    <a href="#tips">tiaozhuandao hhh</a></body></html>3.表格<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title></head><body>    <table border="1"><!--边框-->        <caption>表格名字</caption><!--表格名字-->        <tr>            <th>身高</th>            <th>体重</th>            <th>年龄</th><!--表头-->        </tr>        <tr>            <td>单元格1</td>            <td>单元格1</td>            <td>单元格1</td>        </tr>        <tr>            <td>单元格1</td>            <td>单元格1</td>            <td>单元格1</td>        </tr>    </table><br/>    <table border="1"><!--边框-->        <caption>表格名字</caption><!--表格名字-->        <tr>            <th>身高</th>            <th>体重</th>            <th>年龄</th><!--表头-->        </tr>        <tr>            <td>单元格1</td>            <td>单元格1</td>            <td>单元格1</td>        </tr>        <tr>            <td>                <ul><!--表格中的列-->                    <li>                        苹果                    </li>                    <li>                        香蕉                    </li>                    <li>                        苹果                    </li>                </ul>            </td>            <td>单元格1</td>            <td>单元格1</td>        </tr>    </table><br/>    <table border="1" cellpadding="10"><!--边框--><!--单元格边距-->        <caption>表格名字</caption><!--表格名字-->        <tr>            <th>身高</th>            <th>体重</th>            <th>年龄</th><!--表头-->        </tr>        <tr>            <td>单元格1</td>            <td>单元格1</td>            <td>单元格1</td>        </tr>        <tr>            <td>单元格1</td>            <td>单元格1</td>            <td>单元格1</td>        </tr>    </table><br/>    <table border="1" cellspacing="10"><!--边框--><!--单元格间距-->        <caption>表格名字</caption><!--表格名字-->        <tr>            <th>身高</th>            <th>体重</th>            <th>年龄</th><!--表头-->        </tr>        <tr>            <td>单元格1</td>            <td>单元格1</td>            <td>单元格1</td>        </tr>        <tr>            <td>单元格1</td>            <td>单元格1</td>            <td>单元格1</td>        </tr>    </table><br/>    <table border="1" bgcolor="fuchsia"><!--边框--><!--背景颜色-->        <caption>表格名字</caption><!--表格名字-->        <tr>            <th>身高</th>            <th>体重</th>            <th>年龄</th><!--表头-->        </tr>        <tr>            <td>单元格1</td>            <td>单元格1</td>            <td>单元格1</td>        </tr>        <tr>            <td>单元格1</td>            <td>单元格1</td>            <td>单元格1</td>        </tr>    </table><br/>    <table border="1" background="images/望京.png"><!--边框--><!--背景图片-->        <caption>表格名字</caption><!--表格名字-->        <tr>            <th>身高</th>            <th>体重</th>            <th>年龄</th><!--表头-->        </tr>        <tr>            <td>单元格1</td>            <td>单元格1</td>            <td>单元格1</td>        </tr>        <tr>            <td>单元格1</td>            <td>单元格1</td>            <td>单元格1</td>        </tr>    </table></body></html>

阅读全文

0 0