美文网首页Web前端之路
HTML学习笔记(一)

HTML学习笔记(一)

作者: Beoyan | 来源:发表于2020-04-16 09:23 被阅读0次

一、结构标记

  • header 页头文档头
  • section 页面主体 文档主体
  • nav导航
  • aside边栏
  • article文章
  • footer底部
    其中 header nav footer section用的比较多主要是切分结构方便阅读。

二、标签

  • <br> 换行
  • <title> 标题
  • <nobr> 强制不换行
  • <h1>~<h6> 最多6级标题
  • <p> 这是段落大多数来做正文
  • <pre> 预格式化
  • <div> 这是分区标记
  • <b>粗体
  • <i>斜体
  • <s>删除线
  • <u>下划线
  • <strong> 强调(和粗体一样)
  • <em> 和斜体一样
  • <sub>下标
  • <sup>上标
  • <hr> 水平线分割线
  • <img> 图片
  • <a> 链接
<!-- 链接地址 target:_self本窗口 _blank 新窗口 href 链接地址 #xxx 锚点标记实现点击跳转 可以指向锚点也可以直接指向id -->
<a href="#" target="_blank"></a>
<!-- 这是一个锚点可以通过<a>跳转 -->
<a name="poem">定义锚点</a>
  • <table>
        <!-- (<tr> align 水平对齐,valign 垂直方向),(<td> align水平,valign 垂直 width 宽度 height 高度 colspan 跨列 rolspan 跨行 -->
       <table>
            <caption>这里是表的标题</caption>
            <!-- 这里是表头 -->
            <thead>
                <tr>
                    <!-- <td> 用的居多 <th>主要特点 居中对齐 文字加粗 -->
                    <th>header</th>
                </tr>
            </thead>
            <!-- 这里是表主体 -->
            <tbody>
                <tr>
                    <td>data</td>
                </tr>
            </tbody>
            <!-- 这里是表底部 -->
            <tfoot>
                <tr></tr>
            </tfoot>
        </table>
  • <ol> 有序列表 <li> type
  • <ul> 无序列表 (type:disk,circle,square)
  • <dl> 定义列表 <dt> 定义标题 <dd>定义内容
  • <form> :表单 method= get/post action 提交的路径
  • <input> 输入框 name:为input命名,提交必须定义name value: 按钮的文字/文本的初始值 size 文本框宽度 type:定义input 的功能 ,requied,disabled,readonly)
    input type = radio 单选框 必备属性name组名(一组单选框 name必须相同)value 选项值 checked 默认选中 type = checkbox 复选框
    type = reset重置 type=button 按钮 type=submit 提交表单按钮 type = file选中文件 type=hidden 隐藏的表单提交会携带
  • <select> 选择框 name option 定义菜单项 size行数 multiple 允许多选 仅适用多行菜单 selected 加在option上定义菜单默认选中
  • <fieldset> 分组 <legend>来命名
<fieldset>
  <legend>组名</legend>
</fieldset>
  • <textarea>文本域 cols 列数 ,rows行高 ,name命名
  • <label> 文本标签 能和一些标签绑定点击label相当于点击绑定的标签
 <input type="checkbox" id=selected> <label for="selected">点击选中</label>
  • <button> 普通按钮
  • <iframe> 窗口可以打开其他网页
<iframe src="text.html" width="600px" height="400px" frameborder="0" name="window" scrolling="no"></iframe>

三、特殊字符

相关文章

  • HTML5学习笔记之表格标签

    HTML5学习笔记之表格标签 其他HTML5相关文章 HTML5学习笔记之HTML5基本介绍 HTML5学习笔记之...

  • HTML5学习笔记之表单标签

    HTML5学习笔记之表单标签 其他HTML5相关文章 HTML5学习笔记之HTML5基本介绍 HTML5学习笔记之...

  • HTML5学习笔记之基础标签

    HTML5学习笔记之基础标签 其他HTML5相关文章 HTML5学习笔记之HTML5基本介绍 HTML5学习笔记之...

  • HTML5学习笔记之音视频标签

    HTML5学习笔记之音视频标签 其他HTML5相关文章 HTML5学习笔记之HTML5基本介绍 HTML5学习笔记...

  • html

    html学习笔记

  • HTML5基本介绍

    HTML5基本介绍 其他HTML5相关文章 HTML5学习笔记之HTML5基本介绍 HTML5学习笔记之基础标签 ...

  • HTML5—HTML学习

    HTML学习感想: 下面大致的记录了一写HTML的学习笔记 什么是HTML? HTML 是HyperText Ma...

  • 初学HTML

    学习笔记(四)初学HTML HTML初步认识 HTML是英语HyperText Markup Language的缩...

  • HTML 学习笔记(一)

    HTML 简介 什么是 HTML? HTML 是用来描述网页的一种语言。 HTML 指的是超文本标记语言 (Hyp...

  • HTML学习笔记(一)

    本节学习内容 HTML说明 HTML头部标记 标题字 段落标记 建立超链接 使用图像

    网友评论

    本文标题:HTML学习笔记(一)

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