美文网首页
2018-10-22熟悉前端页面元素

2018-10-22熟悉前端页面元素

作者: YW祥 | 来源:发表于2018-10-22 18:45 被阅读0次

一、熟悉标记语言的格式

  • 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

相关文章

网友评论

      本文标题:2018-10-22熟悉前端页面元素

      本文链接:https://www.haomeiwen.com/subject/ojfgzftx.html