HTML基础之HTML标签

HTML(超文本标志语言)

1.html代码实际上就是一套能够被浏览器所识别的规则代码,由一个个标签组合,html代码就是一大串字符串,而这种字符串的格式正好能够被浏览器所识别,也就是web页面;

2.前端与后端交互方式

1)后端通过直接返回浏览器能够识别的html代码

2)后端返回数据,前端替换html种的指定数据

3.HTML标签(注释:快捷键:ctrl+shift+/,注释一行或者多行:ctrl+/)

<!DOCTYPE html><!--标准的html规则,类似于Python的解释器-->
<html lang="en"><!--html标签只能一个,指定语言为en-->
<head><!--head标签的开始-->
    <!--自闭合标签-->
    <meta charset="UTF-8"><!--编码-->
    <!--主动闭合标签-->
    <title>测试</title><!--浏览器tab上的标题-->
</head><!--head标签的结束-->
<body><!--body标签的开始-->

</body><!--body标签的结束-->
</html>

4.h、div、span、input、form、label、select、a、textarea

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
     <!--标题标签-->
     <h1>标题1</h1>
     <h2>标题2</h2>
     <h3>标题3</h3>
     <!--div块级标签,无论自己多大,都占满屏幕,伪白板标签-->
     <div>div标签</div>
     <!--span行内标签又叫内联标签,自己多大就占多大,也叫白板标签-->
     <span>span标签</span>
     <!--属性:写在标签内部的 <> 之间的标签名之后 属性与属性之间用空格分隔-->
     <input type="text" placeholder="请输入用户名">
     <!--value属性是input的默认值属性-->
     <input type="text" value="请输入用户名">
      <!--密文输入框-->
     <input type="password">
     <!--1.按钮:没有在form中时没有任何区别-->
     <input type="button" value="登录">
     <input type="submit" value="注册">
     button没有反应需要主动绑定事件,submit会与后台产生交互
     form跟后台交互:1.form表单的方式;2.异步提交 ajax
     <form method="get">
        <!--<input type="button" value="登录" onclick="alert(1111)">-->
        <!--<input type="submit" value="注册">-->
         <!--radio单选-->
         <span></span><input type="radio" name="sex">
         <span></span><input type="radio" name="sex">
         <!--checkbook多选,checked默认选中-->
         <span>篮球</span><input type="checkbox" checked="checked">
         <span>足球</span><input type="checkbox">
         <!--上传文件-->
         <input type="file">
         <!--文本框-->
         <input type="text">
         <!--重置,必须与form连用才起作用-->
         <input type="reset">
     </form>
     点击用户名没有作用
      <span>用户名</span><input type="text">
     <!--点击用户名,识别点击输入框-->
      <label for="user">用户名</label><input type="text" id="user">
     选择下拉框,selected默认选中,option被select包裹
     <select name="xxxx">
         <option value="2">篮球</option>
         <option value="3" selected="selected">足球</option>
         <option value="1">兵兵球</option>
     </select>
     在本来的页面进行跳转
     <a href="http://www.baidu.com">跳转到百度</a>
     <!--target新打开一个浏览器tab-->
     <a href="http://www.baidu.com" target="_blank">跳转到百度</a>
     <textarea name="122">多行文本</textarea>
</body>
</html>
原文地址:https://www.cnblogs.com/guangjiao/p/11973183.html