1.常用标签 1.文本标题(h1~h6) 权重最大,优先作为关键字被搜索。 2.段落文本(p) 3.换行标签(br) 4.水平线(hr) 5.加粗有两个标记(推荐strong) <b>加粗内容</b>只是显示加粗 <strong>强调的内容</strong>突出的文本 6.倾斜有两个标记(推荐em) <em>强调文本</em> <i>倾斜文本</i> 7.删除线有两个标记(推荐del) <s>文本</s> <del>文本</del> 8.扩展 <u>文本</u>下划线 <sub></sub>下标 <sup></sup>上标 2.显示特殊符号 1.尖角号(<>) < 左尖角号 > 右尖角号 2.空格( ) 宽度受字体限制,不推荐使用   一个中文宽度,推荐使用 3.版权符号(©) © 4.商标符号 ™ ™ ® ® 3.span标签 当元素需要单独修饰时套上span标签。 4.列表 1.无序列表 <ul> <li>无序列表</li> <li>无序列表</li> </ul> 2.有序列表 <ol> <li>有序列表</li> <li>有序列表</li> </ol> 3.自定义列表 <dl> <dt>无缩进</dt> <dd>有缩进</dd> </dl> 5.图片 <img src="图片路径" title="鼠标悬停上去之后的提示信息" alt="图片不显示之后(加载失败)的提示信息" width="200px" height="200px"> 6.超链接 <a href="链接" title="鼠标悬停时的提示信息" target="规定在何处打开文档">内容</a> target属性:A. target="_self" 默认值 B. target="_blank" 新窗口打开 7.table表格 <table> <!--创建表格--> <tr> <!--创建行--> <td>1</td> <!--创建单元格--> <td>2</td> </tr> </table> table属性: 1.width 2.height 3.边框border 4.边框颜色bordercolor 5.背景颜色bgcolor 6.水平对齐align="left/right/center" 7.cellspacing="单元格与单元格之间的间距" 8.cellpadding="单元格与内容之间的空隙" 行tr属性: 1.高度height 2.背景颜色bgcolor 3.文字水平对齐align="left/right/center" 4.文字垂直对齐valign="top/middle/bottom" 单元格td属性: 1.高度height 2.背景颜色bgcolor 3.文字水平对齐align="left/right/center" 4.文字垂直对齐valign="top/middle/bottom" 表格合并列: colspan="所要合并的单元格的列数" 必须给td 表格合并行: rowspan="所要合并的单元格的行数" 必须给td 8.表单 1.<form method="get/post" action="向何处发送表单数据"> <input/> A.属性:type定义输入框的类型 a)文本框 type="text" 密码框 tyoe="password" b)提交框 type="submit"和<button>提交按钮</button>一样 c)按钮框 type="button" 单纯的按钮 d)重置框 type="reset" 清空的效果 e)单选框 type="radio" 同一个单选框列表需要有一个相同的name值 默认值:checked="checked"或只写checked f)复选框 type="checkbox" 同一个复选框列表需要有一个相同的name值 g)上传文件 type="file" h)图片按钮 type="image" 用选中的图片替代“提交”按钮,点击图片是提交功能 i)隐藏按钮 type="hidden" 提交时带给后端一些信息 <input type="hidden" name="" id="" value="带给后端的个人信息"> j)禁用按钮 disabled="disabled" k)只读属性 readonly="readonly" B.属性:placeholder 描述输入字段预期值的简短的提示信息。兼容到IE8以上 C.属性:name必须设置,否则在提交表单时,用户在其中输入的数据不会被发送给服务器 D.属性:value </form> 2.下拉菜单<select><option></option></select> A.select属性:size="数值",数值代表能够显示出几个选项。 B.select属性:multiple 可以进行多选。 C.option属性:必须设置value,为了让后端拿到信息。 D.option属性:selected,默认选中。 3.多行文本输入框<textarea></textarea> A.属性:cols="列数" rows="行数",但需要注意,只是适用于英文字母和阿拉伯数字,不适用于汉字,故不常用。常用css控制宽高。 B.属性:placeholder="提示性内容" C.想要提前写好一些内容,直接在两个标签之间写即可,不用value属性 D.css里可以设置属性resize:vertical(水平方向不可以随意拉伸)/horizontal(竖直方向不可以随意拉伸)/both/none 4.字段集<fieldset></fieldset> A.默认出现一个边框 B.想在边框左上角添加一个压线文字,使用<legend></legend> C.边框内部可以再写其他的表单类型 D.所有的东西都可以使用css进行修饰 5.H5新增标签 A.section元素,表示页面中的一个内容区块 B.article元素,表示一块与上下文无关的独立的内容 C.aside元素,在article之外的,与article内容相关的辅助信息,侧边栏 D.header元素,表示页面中一个内容区块或整个页面的标题 E.footer元素,表示页面中一个内容区块或整个页面的脚注 F.nav元素,表示页面中导航链接部分 G.figure元素,表示一段独立的流内容,使用figcaption元素为其添加标题(第一个或最后一个子元素的位置) H.main元素,表示页面中的主要内容(ie不兼容) I.video元素,audio元素,音视频标签 audio:controls控制栏: loop:循环 autoplay:自动播放 muted:自动静音 video:controls控制栏: loop:循环 autoplay:自动播放 muted:自动静音 poster:视频缩略图 width和height是随原视频等比例缩放,也可以通过css修饰 J.表单新增 <input/> A.type="color" 取色器 B.type="email" 邮箱地址输入框,自带地址校验,地址不对的话提交不了 C.type="url" URL地址,自带地址校验 D.type="tel" 电话号码,使用在手机端,弹出拨号盘 E.type="range" 滑块效果,min="滑块最小值",max="滑块最大值",value="预置值",step="步长" F.type="number" 仅能输入数字,min="数字最小值",max="数字最大值",value="预置值",step="步长" G.type="search" 搜索框,在框后面会有一个清空内容的叉 H.type="date" 日期选择器,month 月份选择器,week 周选择器,datetime-local 时分选择器 K.选项列表 <datalist> <option value=""></option> </datalist> L.表单新增属性 a)autofocus 自动获取焦点 b)required 必填项 c)multiple 在邮箱表单中支持填写多个邮箱地址,地址间用逗号隔开 d)pattern="" 正则表达式
前端学习——html
于 2022-08-30 20:59:45 首次发布