html
1.标题标签，段落标签，换行标签
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1> 苹果收购了最受欢迎的天气APP</h1> <p>Apple has acquired the popular weather app Dark Sky in a move that could turn the iPhone and smartwatch maker into the exclusive provider of an app known for its minute-by-minute weather updates. 苹果收购了最受欢迎的天气APP Darksky,这可能使IPhone和苹果手表的成为以每分更新天气的独立制造商。</p> <p>The acquisition, which Apple (AAPL) confirmed to CNN Business on Tuesday, will mean the end of Dark Sky's apps for Google's Android and Wear OS, according to a Dark Sky blog post. Terms of the deal were not disclosed. 在周二的时候苹果确认收购，这意味谷歌制造的安卓系统的Dark Sky app的终结。</p> <p>From its beginning as a Kickstarter campaign in 2011, Dark Sky wowed users by promising predictive forecasts that were accurate down to the minute and based on users' exact locations.
By applying artificial intelligence to radar data from the National Oceanic and Atmospheric Administration, Dark Sky could tell you exactly when it was going to rain within the next hour, allowing you to time your walk to the coffee shop or your commute home.
By 2015, the company said it was serving 8 million forecasts a day.</p>
<p>author <br/>
louise </p>
</body> </html>
2.文本格式化标签
为文字设置粗体，斜体，下滑线
<body> hi,<strong>louise</strong> I want to <em>make friends</em> with you! let's go to <ins>school</ins>! </body>
3.div 和 span标签
没有特别的语义。是一个盒子用来装内容，布局网页。
div(division)：分区，分割。自己独占一行。
span:跨度。
<body> <div>do you love me?</div> <div>yes!</div> <span>tang</span> <span>song</span> <span>ming</span> </body>
4.图片标签
<body>
<h4>alt:图片显示不出来的替换文本，title提示文本</h4>
<img src="img.jpg" alt="louise" title="i am louise"/>
</body>
<h4>设定图像高度宽度,边框</h4> <img src="img.jpg" alt="louise" title="i am louise" width="500" border="15"/> <img src="img.jpg" alt="louise" title="i am louise" height="500"/>
5.超链接标签
a(anchor)锚
href:
target:默认self. _blank为在新窗口打开
<h4>1.外部链接</h4> <a href="http://www.qq.com" target="_self">qq</a> <a href="http://www.qq.com" target="_blank">qq</a> <h4>2.内部链接</h4> <a href="xx.html" target="_blank">新闻</a> <h4>3.空链接 #</h4> <h4>4.下载链接 文件，exe,zip等</h4> <a href="img.zip">下载文件</a> <h4>5.网页元素链接</h4> <a href="http://www.baiu.com"><img src="img.jpg"/> </a>
6.锚点链接
点击后能快速跳转到本页面指定的位置
在链接文本的href属性中，设置属性值为#名字的形式。
找到目标位置标签，添加id属性=名字。
<h2>目录</h2> 1 <a href="#experice">早年经历 </a><br /> 2 工作经历 <br /> 3 创业经历 <br /> 4 主要成就 <br /> <h3 id="experice">早年经历</h3> 出生于中国北方，在家排行老二。x岁离开家乡到外地上学。xx岁毕业在日企工作。xxx岁日本留学。期间自主创业创立IT公司。
7.表格标签
<table>表格标签
<tr>表格中的行 table row
<td>单元格
<th>表头单元格标签
<table> <tr><th>name</th> <th>sex</th> <th>old</th></tr> <tr><td>louise</td> <td>female</td> <td>18</td></tr> <tr><td>tao</td> <td>male</td> <td>17</td></tr> </table>
表格属性
align:对其方式。left,center,right
border:表格单元格边框
cellpadding:像素值。规定单元边沿与其内容之间的空白。
cellspacing:像素值。规定单元格之间的空白。默认2像素。
width:表格的宽度。
<table align="center" border="1" cellpadding="20" cellspacing="0"> <!-- 表格对齐方式--> <tr><th>name</th> <th>sex</th> <th>old</th></tr> <tr><td>louise</td> <td>female</td> <td>18</td></tr> <tr><td>tao</td> <td>male</td> <td>17</td></tr> </table>
表格结构标签:表格清晰，结构明确
表格头部 <thead>
表格主题<tbody>
<thead> <tr> <th>name</th> <th>sex</th> <th>old</th> </tr> </thead> <tbody> <tr> <td>louise</td> <td>female</td> <td>18</td> </tr> <tr> <td>tao</td> <td>male</td> <td>17</td> </tr>
合并单元格
跨行合并：rowspan . 最上侧
跨列合并：colspan 左侧
<table width="500" height="249" border="1" cellspacing="0"> <tr> <td></td> <td colspan="2"></td> </tr> <tr> <td rowspan="2"></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> </tr> </table>
8.列表
ur里面只能放li
li里可以放任意元素标签
---无序列表
<h4>your favorite fruit</h4> <ul> <li>tomato</li> <li>apple</li> <li>pear</li> <li> <p>i like eat fruit</p> </li> </ul>
---有序列表
<h4>排名榜</h4> <ol> <li>libai</li> <li>taoyuanming</li> <li>ouyangxiu</li> </ol>
------自定义列表
用于对术语和名词解释
<dl> <dt> <dd>
<dl> <dt>关注我们</dt> <dd>官方微信</dd> <dd>联系我们</dd> <dd>合作伙伴</dd> </dl>
9.表单标签
收集用户信息。主要场景注册信息。
-----表单域 <form>。
属性：action method name
-----表单控件。提示信息。
<input>表单元素
属性type + 文本，单选，多选
name: value: 主要是后台查看选择的是什么值。除文本外页面上不显示。
checked:单选和多选。在页面打开的时候默认勾选
<form> 用户名：<input type="text" value="请输入用户名"> <br/> 密码：<input type="password"><br/> 姓别：男<input type="radio" name="sex" value="男"> 女<input type="radio" name="sex" value="女" checked="checked"><br/> 爱好：读书<input type="checkbox" name="hobby"> 睡觉<input type="checkbox" name="hobby"> </form>
<input type="submit" value="免费注册">
<input type="reset" value="重置">
<h4>label:当点击标签内的文本，光标会自动转移到表单元素</h4> <label for="text">用户名：</label><input type="text" id="text"> <label for="nan">男</label><input type="radio" name="sex" value="男" id="nan"> <label for="nv">女</label><input type="radio" name="sex" value="女" checked="checked" id="nv"><br/> <h4>select下拉框。select="selectd"代表默认选中项</h4> <form> 籍贯 <select> <option>henan</option> <option>shandong</option> <option selected="selected">shangxi</option> </select> </form> <h4>文本域：textarea。定义多行文本的输入</h4> <form> 评论 <textarea rows="3" cols="50"></textarea> </form>
