• [HTML]常用标签的使用

    1. <html>
    2.     <head>
    3.         <title>第一个页面</title>    
    4.     </head>
    5.     <body>
    6.         hello world
    7.     </body>
    8. </html>

    html 是整个html文件的根标签,代表这是一个html格式

    head标签里记录页面的属性

    body标签写的是页面上显示的内容

    title标签是页面的标题

     

    注释标签

    标题标签:h1-h6

    hello

    hello

    hello

    hello

    hello

    hello

    段落标签:p

    这是一个段落

    p标签之间存在一个空隙,前面没有空格.中间的空格和换行均无效

    换行标签:br 

    br为break的缩写,属于但标签,不需要结束标签

      在 css 中我们一般使用 px 作为单位

    格式话标签 
    加粗:Strong标签和 b标签都可
    倾斜:em标签或者i标签
    删除线:del标签和s标签
    下划线:ins标签和u标签
    strong 加粗
    加粗
    倾斜
    倾斜
    删除线
    删除线
    下划线
    下划线
    图片标签
    src = "rose.jpg"  alt = " 鲜花 "  title = " 这是一朵鲜花 "  width = "500px"  height = "800px"
    border = "5px" >
    此时要把rose.jpg这个图片文件放入到html文件同级目录中,也可以是绝对路径和网络路径
    alt: 替换文本 . 当文本不能正确显示的时候 , 会显示一个替换的文字 .
    title: 提示文本 . 鼠标放到图片上 , 就会有提示 .
    width/height: 控制宽度高度 . 高度和宽度一般改一个就行 , 另外一个会等比例缩放 . 否则就会图片失衡.
    border: 边框 , 参数是宽度的像素 . 但是一般使用 CSS 来设定 .
    超链接标签:a
    href = "http://www.baidu.com" > 百度
    表格标签
    table 标签 : 表示整个表格
    tr: 表示表格的一行
    td: 表示一个单元格
    th: 表示表头单元格 . 会居中加粗
    thead: 表格的头部区域 ( 注意和 th 区分 , 范围是比 th 要大的 )
    tbody: 表格得到主体区域 .
    table 包含 tr , tr 包含 td 或者 th. 
    1. <tablealign="center"border="1"cellpadding="20"cellspacing="0"width="500"height="500">
    2.     <tr>
    3.         <td>姓名</td>
    4.         <td>性别</td>
    5.         <td>年龄</td>
    6.     </tr>
    7.     <tr>
    8.         <td>张三</td>
    9.         <td>男</td>
    10.         <td>10</td>
    11.     </tr>
    12.     <tr>
    13.         <td>李四</td>
    14.         <td>女</td>
    15.         <td>11</td>
    16.     </tr>
    17. </table>

    列表标签

    无序列表 ul li

    有序列表 ol li

    自定义列表dl dt dd

    1. <h3>无序列表</h3>
    2. <ul>
    3.     <li>咬人猫</li>    
    4.     <li>兔总裁</li>    
    5.     <li>阿叶君</li>
    6. </ul>
    7. <h3>有序列表</h3>
    8. <ol>
    9.     <li>咬人猫</li>    
    10.     <li>兔总裁</li> 
    11.     <li>阿叶君</li>
    12. </ol>
    13. <h3>自定义列表</h3>
    14. <dl>
    15.     <dt>我的老婆们
    16. </dt>
    17.     <dd>咬人猫</dd>
    18.     <dd>兔总裁</dd>
    19.     <dd>阿叶君</dd>
    20. </dl>

    input标签

    1.    1) 文本框
    2.     <input type="text">
    3.    2) 密码框
    4.     <input type="password">
    5.    3) 单选框
    6.     <input type="radio" name="sex">男
    7.     <input type="radio" name="sex" checked>女 
    8.    4) 复选框
    9.     <input type="checkbox">吃饭<input type="checkbox">睡觉 <input type="checkbox"></input type>
    10.    5) 普通按钮
    11.    <input type="button" value="我是个按钮"> </inputtype>
    select标签
      可以给的第一个选项, 作为默认选项  
    1.     <select>
    2.            <option>北京option>
    3.            <option>上海option>
    4.     select>

    无语义标签:div&span

    用于网页布局, div 是独占一行的 , span 不独占一行 
    1. <div>
    2.     <span>咬人猫span>    <span>咬人猫span>    <span>咬人猫span>
    3. div>
    4. <div>
    5.     <span>兔总裁span>    <span>兔总裁span>    <span>兔总裁span>
    6. div>
    7. <div>
    8.     <span>阿叶君span>    <span>阿叶君span>    <span>阿叶君span>
    9. div>

  • 相关阅读:
    工业设计能做出什么独特优势？
    跟着cherno手搓游戏引擎【26】Profile和Profile网页可视化
    二叉树刷题(四)
    Leetcode 85.最大矩形（困难）
    Cadence OrCAD Capture 设置线相对延迟约束的方法
    C++学习——继承
    考过PMP之后，要不要继续学CSPM？
    如何快速开发一个简单实用的MES系统？
    【面试专栏】java线程第一篇：Java线程、线程状态、线程方法
    js文字逐个显示
  • 原文地址：https://blog.csdn.net/m0_64332179/article/details/127607298