• 强哥HTML学习笔记


    html

    浏览器的选择:
    1.火狐
    2.ie
    3.chrome
    4.mac
    5.opera

    安装两款插件:
    1.firebug
    2.web develope

    html页面元素:
    1.doctype
    2.html
    head
    //编码
    //样式
    //事件
    body
    //正文

    sublime
    notepad++
    zend studio
    dreamware
    gvim


    vim模式:
    1.输入模式
    2.命令模式
    3.末行模式

    命令模式:
    命令模式 > 输入模式 按asio键
    a 当前字符的后面插入
    A当前行末尾
    s 删掉当前字符并插入数据
    S删除当前行插入
    i 当前字符前插入
    I 当前航首入
    o 下一行行插入
    O 上一行插入
    输入模式 -> 命令模式 esc

    输入模式 -> 末行模式

    :x 保存并退出
    :q 不保存退出
    :w 保存

    命令模式
    h 左
    j 下
    k 上
    l 右

    yy 复制当前行
    nyy 复制当前行向下n行
    p 往下面粘贴
    P 往上面粘贴
    dd 删除当前行
    ndd 删除当前行向下n行
    nG 第n行
    G 最后一行
    dG 从当前行删除到最后
    ^ 行首
    $ 行末
    d^ 从当前光标删到行首
    d$ 从当前光标删除到行末
    u 恢复
    ctrl+y 撤销

    tab 右缩进
    shift+tab 右缩进
    //视图模式选中

    line_numbers:true/false
    //行号

    auto_match_enabled:false/true
    //格式补全

    highlight_line:true/false
    //背景线

    auto_complete:true/false
    //命令补全

    设置 -> 用户 改变字体大小

    ctrl+/
    //添加注释


    html实体

    <
    &lt;
    >
    &gt;
    空格
    &bnsp;

    #ff00ff 紫色
    #ff0000 红色
    #

    白色 ffffff
    黑色 000000
    红色 ff0000
    绿色 00ff00
    蓝色 0000ff
    黄色 ffff00
    紫色 ff00ff
    青色 00ffff
    灰色 cccccc


    body //属性
    text //字体颜色
    bgcolor //背景颜色

    br //换行
    nobr //不换行
    p //段落
    center //居中
    pre //代码原样输出
    hr //导航线

    列表:
    有序列表 ol
    无序列表 ul
    自定列表 dl

    align //独占一行的才有这个属性

    文字标签:

    h1
    font
    p
    span
    b 加粗
    i 斜体
    u 下划线
    sup 上标
    sub 下标

    无意义块标签:
    div

    图片img:
    属性
    src
    width
    height
    title
    alt

    所有标签都有的属性:
    1.title
    2.style
    3.id
    4.class

    热点地图:
    usemap
    00坐标在图片左上角
    area标签:
    shape
    coords
    href

    静态资源地址问题:
    1、img/cai.gif
    2./test/img/a.jpg

    加载静态资源的标签:
    1.<img src="cai.gif">
    2/<link rel="stylesheet" type="a.css">
    3.<script scr="a.js"></script>
    4.<a href="a.html"></a>

    锚点-a标签
    <a name="top"></a> //返回网页顶层


    超链接-a标签
    <a href="www.baidu.com">百度</a>
    <a href="#top">top</a>

    表格-table标签:
    tables
    tr
    td


    表单-form标签
    action="reg.php"
    method="get"

    文本元素
    <input type="text" name="">
    密码元素
    <input type="password" name="">
    提交
    <input type="submit" value="提交">
    重置
    <input type="reset" value="重置">
    单选
    <input type="radio" name="">
    1.名字和值必须有
    2.名字必须相同
    3.必须有id
    4.label用for连接到前面的input的id上

    多选
    <input type="checkbox" name="">
    1.名字和值必须有
    2.名字相同必须是数组,要么名字不能相同
    3.必须有id
    4.label用for连接到前面的inputid上

    下拉框
    <select name=""><option value="">选择城市</option></select>


    区域框
    <textarea name=""></textarea>
    1.name
    2.不能写value

    表单元素:
    name
    value
    maxlength //最大字符数
    readonly //只读,不能改,能提交
    disabled //不能改,不能提交

    框架-frameset标签:


    内嵌框架-iframe标签:

    复习
    格式标签
    1.br 换行
    2.p 段落
    3.h1 加粗
    4.hr 导航线
    5.nobr 不换行
    6.pre 源码输出
    7.center 居中
    8.b 加粗
    9.i 斜体
    10.u 下划线

    文本标签
    1.font
    2.span
    3.p 段落
    4.h1 加粗

    A标签和锚点
    1.<a href="" target="_blank">打开新窗口</a>
    2.<a name="top"></a>
    target属性的值:
    1._top
    2._self
    3._blank
    4._parent
    5.窗口名称

    图片标签
    <img src="" />

    表格标签
    <table border="1px" width="500px">
    <tr>
    <td></td>
    <td></td>
    </tr>
    <tr>
    </tr>
    </table>

    表单标签
    <form action="">
    <input type="text">
    <input type="password">
    <input type="radio">
    <input type="reset">
    <input type="checkbox">
    <select>
    <option value=""></option>
    </select>
    <textarea>文本域</textarea>
    </form>


    frame
    <frameset>
    <frame src="">
    <frame src="">
    </frameset>

    框架属性
    frameborder 1|0 是否有边框
    border 30px 边框的宽度
    bordercolor blue 边框的颜色(chrome支持)

    frame属性
    1.name 窗口名称
    2.src 在本窗口打开的页面
    3.noresize 不能改变大小
    4.scrolling no|auto

    iframe 内嵌框架
    <iframe src="myflash/index.html" frameborder="0" width="200px" height="300px" scrolling="no"></iframe>
    属性
    1.src
    2.frameborder 0|1 有没有边框
    3.width 宽
    4.height 高
    5.scrolling no|auto|yes 滚动条

    H5视频标签
    <video src="movie.ogg" controls="controls"></video>

    当前,video 元素支持三种视频格式:
    Ogg MPEG4 WebM

    autoplay 如果出现该属性,则视频在就绪后马上播放。
    controls 如果出现该属性,则向用户显示控件,比如播放按钮。
    height 设置视频播放器的高度。
    loop 如果出现该属性,则当媒介文件完成播放后再次开始播放。
    preload 如果出现该属性,则视频在页面加载时进行加载,并预备播放。
    如果使用 "autoplay",则忽略该属性。
    src 要播放的视频的 URL。
    width 设置视频播放器的宽度。

    视频控制play() pause() load()

    H5音频标签
    <audio src="song.ogg" controls="controls"></audio>

  • 相关阅读:
    前端性能优化(一)时间角度优化:减少耗时
    前端性能优化(二)空间角度:降低资源占用
    vue中form验证
    迅为国产瑞芯微RK3568工业级核心板方案
    迅为国产开发板值得入手的三款开发板
    【重磅来袭】迅为RK3568 Android11系统移植视频教程
    迅为RK3568开发板鸿蒙OpenHarmony系统固件烧写
    2022面试题
    关于elupload上传图片的一些坑clearFiles()的使用
    vue中form组件中上传elupload(单、多附件上传,以及上传回显以及编辑不出现等问题)
  • 原文地址:https://www.cnblogs.com/redheat/p/7069785.html
Copyright © 2020-2023  润新知