html基础

一 常用快捷键

ctrl+s 保存
F2 重命名
F11 全屏
ctrl+tab 同一个程序文档之间切换
alt+tab 不同程序之间的切换
wid+e 打开计算机
wid+d 回到桌面
wid+r 运行面板 cmd
Ctrl+w 关闭当前文档
wid+L 锁屏

二 的基本结构

HTML的基本机构
<!DOCTYPE html> 声明文档类型
<html>                   根标签
<head>title</head>
<body>                   主体标签
......
</body>
</html>

三 标签分类

单标签(无闭合标签)
<!DOCTYPE html> <img>
双标签(以'/'闭合标签)
<html></html>

四 常用标签

<html>…</html> 定义 HTML 文档
<head>…</head> 文档的信息
<meta> HTML 文档的元信息
<title>…</title> 文档的标题
<link> 文档与外部资源的关系
<style>…</style> 文档的样式信息
<body>…</body> 可见的页面内容
注释
<h1>...</h1> 标题字大小(h1~h6)
<b>...</b> 粗体字
<strong>...</strong> 粗体字(强调)
<i>...</i> 斜体字
<em>...</em> 斜体字(强调)
<u>...</u> 下划线
<del>...</del> 删除线(表示删除)
<center>…</center> 居中文本
<ul>…</ul> 无序列表
<ol>…</ol> 有序列表
<li>…</li> 列表项目
<a href=”…”>…</a> 超链接
<font> 定义文本字体尺寸、颜色、大小
< sub > 下标
< sup > 上标
<p> 段落
<img src=’”…”> 定义图像
<table>…</table> 定义表格
<th>…</th> 定义表格中的表头单元格
<tr>…</tr> 定义表格中的行
<td>…</td> 定义表格中的单元
<form>…</form> 定义供用户输入的 HTML 表单 <frame> 定义框架集的窗口或框架

五 文件路径

相对路径
文件和文件在同一个目录(文件夹),直接写文件名即可
文件在文件的下一级目录(从当前文档出发的文件夹)
文件夹名+/+文件名
文件在文件的上一级目录或者文件夹
../+文件名
文件在文件的下一级的下一级 / /
文件在文件的上一级的下一级
../wenjianming/wenjian


绝对路径
从盘符开始的绝对路径最好不用,建议使用相对路径
从服务器根目录开始

六 列表

列表是用来装数据的容器
无序列表 顺序没有要求
<ul>
<li></li>
</ul>
注意:
ul里只能嵌套li
li里可以嵌套任意标签
type=“disc” 默认值 实心小圆圈
circle 空心小圆圈
square 小方块

有序列表 对顺序有要求的 按规则排序
li是列表项
type=“1”“a”“A”默认阿拉伯数字排序
stary=“起始值”
<ol>
<li></li>
</ol>

自定义列表
注意:dl里只能嵌套dt和dd,dt里只能嵌套行内元素,dd可以嵌套任意标签。

七 表格

表格的基本结构
width 宽度 height 高度 border 边框
cellpadding 内容距边框的距离
cellspacing 单元格与单元格的距离 默认值为2
bgcolor 背景颜色
align=“left”“right”“center” 水平对齐方式 使用在table上,决定了表格的对齐方式,使用在tr或者td上,是行或者单元格里内容的对齐方式。
表格的标准结构
一般情况下,<tfoot></tfoot>可以省略,<thead></thead> 一般是一行
四标题、表头、单元格合并
table>tr3>td3
caption 表格标题
<th></th>特殊单元格,表格的表头,内容居中加粗
colspan 水平方向单元格的合并
rowspan 垂直方向单元格的合并
注意事项:
table里边只能嵌套thead tbody tfoot tr caption
tr里可以嵌套td和th td和th里可以嵌套任意标签的

八 表单

表单是用来收集用户信息的。
表单分三部分组成
1.提示信息
2.表单控件
3.表单域
<form></form>
action 表单收集的信息给哪个文件处理
method=“get”/“post”.
用户名:name=“username”
密码:name="pwd"
单行文本输入框
<input type="text">
name 输入框名称
value 默认值
placeholder 期望用户输入的值
readonly 只读 (可以复制但是不能输入)
disable 未激活
autofocus 自动获取光标焦点
accesskey 获取光标焦点的快捷键 Chrome 需要配合alt使用
autocomplete=“on/off” 自动记忆功能 默认值on,off关闭自动记忆功能
required 输入的内容不能为空
密码输入框
<input type="password" name="pwd">
注意:单行文本输入框的所有属性值,对于密码输入框都有效
单选框 <input type="radio">
如果想实现单选效果,就要将name的值设置相同
checked 设置默认选项
多选框 <input type="checkbox">
checked 设置默认选项

下拉列表
<select> 下拉列表
<option></option> 下拉列表的选项
<option></option>
<option></option>
</select>
selected 设置下拉列表的默认选项
实现下拉列表多选效果 multiple
下拉列表分组效果
optgroup 实现下拉列表分组效果
label 下拉列表分组名称

文件上传控件
<input type="file">
multiple 实现多选效果 shift连续选 alt 间隔选
隐藏域 <input type="hidden">
文本域 <textarea></textarea。
cols 单行输入的字符数
rows 输入的行数

带下拉列表的输入框
list的作用是用来关联datalist的id实现带下拉列表的输入框
label for id 就是通过for id 将文字和 input 关联起来,点击文字的时候,触发input的状态
邮件控件 <input type="email">
网址控件<input type="url">
搜索控件 <input type="search">
数字控件 <input type="number">
min 最小值 max 最大值 step 每次变化的数字
范围控件 <input type="range">

时间控件
月控件 <input type="month">
提交按钮 <input type="submit" value="快速注册">
普通按钮 <input type="button" value="不能提交">
经常配合js做一些特效
button按钮可以提交 <button></button>
图片按钮 <input type="image" src="地址">
重置按钮 <input type="reset">

九 特殊字符

特殊字符.png
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • HTML基础 本文包括 HTML基本知识与结构 HTML常见标签 标签写法与嵌套的讨论 HTML、CSS、java...
    廖少少阅读 6,392评论 2 21
  • 原 Blog 链接:HTML基础学习笔记 自学 html 基础笔记 Web 前端简单介绍 web 前端包含: pc...
    任凱阅读 5,232评论 0 5
  • html简介: HTML学习总结慕课网 一、html介绍 (一)html和Css的关系 HTML是网页内容的载体。...
    数独题阅读 3,940评论 0 1
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 176,060评论 25 709
  • 本文根据众多互联网博客内容整理后形成,引用内容的版权归原始作者所有,仅限于学习研究使用,不得用于任何商业用途。 a...
    深红的眼眸阅读 5,826评论 0 2

友情链接更多精彩内容