html知识点总结
h1-h6:标题标签
p:段落标签
br:换行标签
hr:水平线标签
strong:加粗(b)
em:倾斜(i)
del:删除线(s)
ins:下划线(u)
img:图片(src路径 alt替换文本 title提示文本 weight宽度 height高度 border相框)
audio:音频(src路径 autoplay自动播放controls播放控件 loop循环播放)
video:视频(src路径 autoplgy自动播放谷歌配合meted静音播放 controls播放控件 loop循环播放)
a:链接 (href+目标网址 target页面打开方式默认- self当前页面打开覆盖 -blank打开新页面 不覆盖)
ul:无序列表(常用新闻 导航 ul只能包含li li里面包含任意标签 有小圆点 css可以消除)
ol:有序列表 (常用排行榜 ol里面只能包含li li里面可以包含任意标签 有数字 可以css消除)
dl:自定义列表 (常用底部导航 有缩进即空格
dl只能包含dt dd dt是列表标题 dd是列表项 dt和dd是并列关系 dt和dd可以包含任意标签)
ctrl+c复制 ctrl+v粘贴 ctrl+x剪切 win+shift+s截屏 ctrl+shift+esc是打开电脑性能 ctrl+d是选中光标 可以批量修改标签 ctrl+a是全选
在列表标签中 将文字排版排好 用鼠标光标定位在开始项上 shift+alt可以移动光标多项闪烁 批量将文字输入到标签中
快速打多个带文本的标签 如p{文本}*数字 便可以打出多个标签
打出父子或者兄弟标签时也可以使用来快速打出 比如ul>li 4
ol>li4
dl>dt+dd3
父子关系标签用大于号 兄弟关系标签用加号 如h3+p
路径一般选择用./来选择对应的文件夹 下一级目录用/ 上一级用…/
table:表格标签 包含元素有tr td th 其中tr是表格的一行 里面包含td或者th 其中th一般作为替换td使用 表示表格头部单元格
table>tr>td/th table标签可以包含的属性有border(边框)width(宽度) height(高度)
align(left居左/center居中/right居右)
rules(取值all 细化边框)
tr和th、td可以包含width height align bgcolor
其中bgcolor是背景颜色
thead是表格头部 tbody是表格主体 tfoot是表格底部 caption是表格大标题 一般写在table里面 可以包含标题标签进行文字加粗等操作
合并单元格在没有确定thead tbody tfoot的时候可以合并 在确定之后不可以跨区域合并 其中rowspan是垂直合并 即跨行合并 colspan是水平合并 即跨列合并 合并单元格遵循左上原则 垂直取上 水平取左 在确定合并的单元格之后删除或者注释一下要合并的剩下的单元格 留下取值的那个单元格 然后就可以进行合并 在没有很熟练的时候建议注释 不建议删除
表单标签(input)的属性有很多 一般表单标签用在搜索框 导航框 注册 登陆页面 添加表单域使用form标签来实现重置按钮等作用
(text:文本框 一般是默认值)
(password:密码框 一般输入的时候内容会变成小圆点)
(radio:单选框 一般用作性别选择等单选情况 使用属性name选择一组对应的单选框 name里面的值保持一致 才能实现二选一 如果有默认选则的时候添加checked就可以实现 默认选择的属性在多选框中也同样适用)
(checkbox:多选框 属性checked也可以适用)
(file:选择文件 一般只能选择一个文件 有需要添加多个文件的时候选择使用multiple属性 可以实现选择多个文件)
(placeholder:占位符 一般显示在文本框中用作提示 对文本框中原有属性无影响)
(submit:提交按钮 会自动出现提交二字 需要修改按钮内文字可以使用value属性来进行修改)
(reset:重置按钮 会自动出现重置二字 需要配合form表单域来实现重置功能 可以添加value属性来修改按钮内文字)
(button:普通按钮 会出现一个空白的按钮 配合value属性来添加文字 后续通过js来实现作用 button也可以作为一个单独的标签来使用 在谷歌浏览器中 button默认是提交按钮)
button(属性有submit:提交按钮
reset:重置按钮
button:普通按钮 后期配合js)
下拉标签:select:表示下拉标签整体
option:表示下拉标签的每一项
selected:表示默认选中
文本域:<textarea placeholder="请您留言"></textarea>
lable标签:
<label for="txt">文本框: <input type="text" id="txt"></label><br>
性别:<label for="nan"><input type="radio" name="sex" id="nan">男</label>
<label for="nv"><input type="radio" name="sex" id="nv">女</label>
<!-- 方法二 -->
<hr>
<label><input type="radio" name="sex">男</label>
<label><input type="radio" name="sex">女</label>
(添加lable标签可以实现点击图片 文字等就可以选中 增加用户体验)
搜索框: <input type="search"><br>
时间: <input type="time"><br>
日期: <input type="date"><br>
数字: <input type="number"><br>
颜色: <input type="color">