zoukankan      html  css  js  c++  java
  • 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>
  • 相关阅读:
    Atcoder Beginner Contest075 翻车记
    bzoj1972 猪国杀 大♂模拟
    10月9-11日连续大翻车实录
    10月8日翻车实录
    10月7日考试翻车实录
    四月は君の嘘?人生は君の嘘?
    NOIP模拟 gcd 数学
    NOIP模拟 water 最小生成树
    NOIP模拟 mine DP
    bzoj2064 分裂 状压DP
  • 原文地址:https://www.cnblogs.com/guangjiao/p/11973183.html
Copyright © 2011-2022 走看看