2018-10-22熟悉前端页面元素
2018-10-22 本文已影响0人
YW祥
一、熟悉标记语言的格式
- html：“超本文”就是指页面内可以包含图片、链接、甚至音乐、程序的非文字元素。
- 超文本标记语言的结构包括“头”部分（英语：Head）、和“主题”部分（英语：Body），其中“头部”提供关于网页的信息“主题”部分提供网页的具体内容。
二、常用标签
- input
- select 下拉框
- a：超链接
- img：图片
- audio：音频
- video：视频
例子：
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>第一个练习htal页面逃之夭夭</title>
</head>
<body>
<h1>这是一个h1标签</h1>
<h2>这是一个h1标签</h1>
<h3>这是一个h1标签</h1>
</br>
<td>姓名</td>
<input type='text'>
<br>
<td>性别</td>
<input type='number'>
<br>
<td>密码</td>
<input type='possword' value='密码'>
<td>单选框</td>
<input type='radio' name='sex'>
<td>男</td>
<input type='radio' name='sex'>
<td>女</td>
<input type='radio' name='set'>
<td>其他</td>
<br>
<br>
<td>班级</td>
<input type='radio' name='class'>
<td>1810</td>
<input type='radio' name='class'>
<td>1808</td>
<br>
<td>多选框</td>
<input type='checkbox' name='class'>
<td>A</td>
<input type='checkbox' name='class'>
<td>B</td>
<input type='checkbox' name='class'>
<td>C</td>
<input type='checkbox' name='class'>
<br>
<td>普通按钮</td>
<input type='button' value='按钮'>
<br>
<td>日期<td>
<input type='date'>
<br>
<td>时间</td>
<input type='time'>
<br>
<td>文本输入区</td>
<textarea></textarea>
<td>下拉框<td>
<select>
<option>李<option>
<option>赵<option>
<option>张<option>
</select>
</br>
<td>超链接</td>
<td>
<a href='http://www.jianshu.com'>简书</a>
<td>
</br>
<td>reset:重置按钮</td>
<input type='reset' value='重置'>
</br>
<td>supmit:提交按钮</td>
<input type='submit' value='提交'>
</br>
<td>img:图片</td>
<img src="../picture/111.png">
<br>
<td>audio:音频</td>
<audio controls="" loop="true">
<source src='../media/mp3/a.mp3' type="audio/mpeg">
</audio>
<br>
<td>video:视频</td>
<video controls="">
<source src='../media/mp4/StartMenu_Win10.mp4' type=video/mp4>
</video>
</body>
</html>
截图：
熟悉页面前端元素.png
