• HTML


    前期认识

    内核(渲染引擎)

    • IE内核——Trident
    • 火狐内核(Firefox)——Gecko
    • 苹果内核(Safari)——webkit
    • 谷歌内核——Blink
    • Opera内核——Blink

    HTML——超文本标记语言

    <!doctype html>					——当前文档类型
    <html>
      <head>
        <title>设置网页头部标题</title>
        <meta name="description"  content="对当前网站的描述信息">
        <meta name="keywords" content="">——关键字
        css书写位置
        <style type="text/css">
        </style>
        <link rel="stylesheet" type="text/css" href="">
        
        <link rel="icon" href="">	  ——设置网页图标
        <meta charset="UTF-8">		  ——防止乱码
      </head>
      <body>
        <br>						——换行
        <hr>						——横线
        <p>
          							——段落
        </p>
        <h1></h1>~<h6></h6> 		  ——标题
        <strong></strong>/<b></b> 	   ——加粗
        <em></em>/<u></u>			  ——倾斜
        <ins></ins>/<u></u>			  ——下划线
        <font color="" size=""></font> ——文字设置
        <del></del>/<s></s>			  ——删除线
        <img src="" title="悬停文字" alt="无图文字">
        <a href="目标路径" title="悬停文字"></a>	——超链接
        <p id="test2">2阿斯顿发撒旦法放大女</p>
    	<a href="#test2">找以数字为2开头的段落</a>	——锚链接
        无序列表
        <ul>
          <li></li>
        </ul>
        有序列表
        <ol>
          <li></li>
        </ol>
        自定义列表
        <dl>
          <dt>列表标题</dt>
          <dd>列表项</dd>
        </dl>
        表格
        <table>
          <caption></caption>		——标签中可以设置 h1-h6样式的标题
          <tr>
          	<td></td>
          </tr>
        </table>
        表单域
        <form action="设置一个用来处理表单数据的后台程序" method="设置提交方式"> 
          <fieldset>
            <legend>表单域所含内容</legend>
          	表单控件:
          	<input type="text" autofocus placeholder="灰色文字">——输入框,自动获取鼠标焦点
          	<input type="password">——密码
          	<input type="checkbox">——复选框
         	<input type="radio" name="" checked>——单选框
          	<input type="file">——上传控件
            按钮:
            <input type="reset">——重置按钮
            <input type="submit">——表单提交按钮
            <input type="image" src="">——图片提交按钮
            <input type="button" value="按钮">——普通按钮
          	<textarea style="resize:none;"></textarea>——多行文本域
          	/*使用reszie:none可以禁止文本域随意拖拽*/
    
            下拉列表框:
            <select>
              <optgroup label="">
              	<option></option>
              </optgroup>
            </select>
          </fieldset>
        </form>
      </body>
    </html>
    

    表格

    • border——默认表格没有边框
    • width和height——设置表格大小
    • cellspacing——设置单元格与table之间的距离 cellspacing="2" 默认值
    • cellpadding——设置内容与单元格之间的距离
    • bgcolor——设置背景色
    • colspan——横向合并
    • rowspan——纵向合并
    • 设置表格或者内容对齐方式
      align: left | center | right
      ✔ 如果将align属性设置给table,那么控制的是整个表格的对齐方式
      ✔如果将align属性设置给tr或者td,那么控制的是内容的对齐方式
    • border-collapse: collapse;——边框合并

    表单控件

    1. 给表单控件设置  autofocus   自动获取鼠标焦点
    
    2. 点击表单控件前文字选中对应的表单控件
    	<label for="phone_number">手机号:</label>
    	<input type="text" placeholder="请输入手机号" maxlength="11" id="phone_number">
    
    备注:
    	label 中for属性的值对应的是 input标签中的id值
    
  • 相关阅读:
    编译openwrt时报错build_dir/hostpkg/libubox-2018-07-25-c83a84af/blobmsg_json.c:21:19: fatal error: json.h: No such file or directory
    git add时遇到类似fatal: Path 'XXX' is in submodule 'XXX'错误提示如何解决?
    select下拉框多选取值
    JavaScript substr() 方法
    select2多选设置select多选,select2取值和赋值
    bootstrap select 多选的用法,取值和赋值(取消默认选择第一个的对勾)
    Bootstrap select 多选并获取选中的值
    Bootstrap select多选下拉框实现代码
    Bootstrap selectpicker 下拉框多选获取选中value和多选获取文本值
    Mysql中EXISTS关键字用法、总结
  • 原文地址:https://www.cnblogs.com/shuiyu/p/10470529.html
Copyright © 2020-2023  润新知