免费网站从哪里申请,wordpress wp-config,可以建网站的路由器,网络规划设计师视频徐朋百度网盘1.HTML的标签分类
1.1常用排版标签
标签名语义和功能属性单标签还是双标签h1 ~ h6一级标题~六级标题无双标签p段落无双标签hr分隔线无单标签br换行无单标签pre原格式显示无双标签div无语义#xff0c;用于页面布局无双标签
1.1.1h标题标签
!DOCTYPE html
htm…1.HTML的标签分类
1.1常用排版标签
标签名语义和功能属性单标签还是双标签h1 ~ h6一级标题~六级标题无双标签p段落无双标签hr分隔线无单标签br换行无单标签pre原格式显示无双标签div无语义用于页面布局无双标签
1.1.1h标题标签
!DOCTYPE html
htmlheadmeta charsetutf-8title文本标签/title/headbodyh1h1/h1h2h2/h2h3h3/h3h4h4/h4h5h5/h5h6h6/h6/body
/html 1.1.2.p段落标签
!DOCTYPE html
htmlheadmeta charsetutf-8title文本标签/title/headbodyp豫章故郡洪都新府。星分翼yì轸zhěn地接衡庐。襟jīn三江而带五湖控蛮荆而引瓯ōu越。物华天宝龙光射牛斗之墟人杰地灵徐孺下陈蕃之榻tà。雄州雾列俊采星驰。台隍枕夷yí夏之交宾主尽东南之美。都督阎公之雅望棨qǐ戟jǐ遥临宇文新州之懿yì范襜chān帷暂驻。十旬休假胜友如云千里逢迎高朋满座。腾蛟起凤孟学士之词宗紫电青霜王将军之武库。家君作宰路出名区童子何知躬逢胜饯。/pp时维九月序属三秋。潦水尽而寒潭清烟光凝而暮山紫。俨骖cān騑fēi于上路访风景于崇阿。临帝子之长洲得天人之旧馆。层峦耸sǒng翠上出重霄xiāo飞阁流丹下临无地。鹤汀tīng凫fú渚穷岛屿之萦yíng回桂殿兰宫即冈峦之体势。/p/body
/html 1.1.3hr分割线
!DOCTYPE html
htmlheadmeta charsetutf-8title文本标签/title/headbodyp豫章故郡洪都新府。星分翼yì轸zhěn地接衡庐。襟jīn三江而带五湖控蛮荆而引瓯ōu越。物华天宝龙光射牛斗之墟人杰地灵徐孺下陈蕃之榻tà。雄州雾列俊采星驰。台隍枕夷yí夏之交宾主尽东南之美。都督阎公之雅望棨qǐ戟jǐ遥临宇文新州之懿yì范襜chān帷暂驻。十旬休假胜友如云千里逢迎高朋满座。腾蛟起凤孟学士之词宗紫电青霜王将军之武库。家君作宰路出名区童子何知躬逢胜饯。/phrp时维九月序属三秋。潦水尽而寒潭清烟光凝而暮山紫。俨骖cān騑fēi于上路访风景于崇阿。临帝子之长洲得天人之旧馆。层峦耸sǒng翠上出重霄xiāo飞阁流丹下临无地。鹤汀tīng凫fú渚穷岛屿之萦yíng回桂殿兰宫即冈峦之体势。/p/body
/html 1.1.4br换行标签
!DOCTYPE html
htmlheadmeta charsetutf-8title文本标签/title/headbodyh1换行标签/h1豫章故郡洪都新府。星分翼yì轸zhěn地接衡庐。襟jīn三江而带五湖控蛮荆而引瓯ōu越。物华天宝龙光射牛斗之墟人杰地灵徐孺下陈蕃之榻tà。雄州雾列俊采星驰。台隍枕夷yí夏之交宾主尽东南之美。都督阎公之雅望棨qǐ戟jǐ遥临宇文新州之懿yì范襜chān帷暂驻。十旬休假胜友如云千里逢迎高朋满座。腾蛟起凤孟学士之词宗紫电青霜王将军之武库。家君作宰路出名区童子何知躬逢胜饯。br时维九月序属三秋。br潦水尽而寒潭清烟光凝而暮山紫。俨骖cān騑fēi于上路访风景于崇阿。临帝子之长洲得天人之旧馆。层峦耸sǒng翠上出重霄xiāo飞阁流丹下临无地。鹤汀tīng凫fú渚穷岛屿之萦yíng回桂殿兰宫即冈峦之体势。/body
/html 1.1.5pre 原格式显示
!DOCTYPE html
htmlheadmeta charsetutf-8title文本标签/title/headbodyh1原格式显示标签/h1pre豫章故郡洪都新府。星分翼yì轸zhěn地接衡庐。襟jīn三江而带五湖控蛮荆而引瓯ōu越。物华天宝龙光射牛斗之墟人杰地灵徐孺下陈蕃之榻tà。雄州雾列俊采星驰。台隍枕夷yí夏之交宾主尽东南之美。都督阎公之雅望棨qǐ戟jǐ遥临宇文新州之懿yì范襜chān帷暂驻。十旬休假胜友如云千里逢迎高朋满座。腾蛟起凤孟学士之词宗紫电青霜王将军之武库。家君作宰路出名区童子何知躬逢胜饯。时维九月序属三秋。潦水尽而寒潭清烟光凝而暮山紫。俨骖cān騑fēi于上路访风景于崇阿。临帝子之长洲得天人之旧馆。层峦耸sǒng翠上出重霄xiāo飞阁流丹下临无地。鹤汀tīng凫fú渚穷岛屿之萦yíng回桂殿兰宫即冈峦之体势。/pre/body
/html 1.1.6div页面布局标签
无具体显示仅仅做页面布局时使用
!DOCTYPE html
htmlheadmeta charsetutf-8title文本标签/title/headbodyh1页面布局标签/h1div豫章故郡洪都新府。星分翼yì轸zhěn地接衡庐。襟jīn三江而带五湖控蛮荆而引瓯ōu越。物华天宝龙光射牛斗之墟人杰地灵徐孺下陈蕃之榻tà。雄州雾列俊采星驰。台隍枕夷yí夏之交宾主尽东南之美。都督阎公之雅望棨qǐ戟jǐ遥临宇文新州之懿yì范襜chān帷暂驻。十旬休假胜友如云千里逢迎高朋满座。腾蛟起凤孟学士之词宗紫电青霜王将军之武库。家君作宰路出名区童子何知躬逢胜饯。/divdiv时维九月序属三秋。潦水尽而寒潭清烟光凝而暮山紫。俨骖cān騑fēi于上路访风景于崇阿。临帝子之长洲得天人之旧馆。层峦耸sǒng翠上出重霄xiāo飞阁流丹下临无地。鹤汀tīng凫fú渚穷岛屿之萦yíng回桂殿兰宫即冈峦之体势。/div/body
/html 1.2.文本标签
标签名语义和功能属性单标签还是双标签em强调默认表现斜体字无双标签strong强调默认表现粗体字无双标签ins表示增加的内容默认添加下划线无双标签del表示删除的内容默认添加删除线无双标签sub下标字无双标签sup上标字无双标签span无语义配合CSS给文字设置样式无双标签
1.2.1em与strong强调标签
!DOCTYPE html
htmlheadmeta charsetutf-8title文本标签/title/headbodyh1强调标签/h1em豫章故郡洪都新府。星分翼yì轸zhěn地接衡庐。襟jīn三江而带五湖控蛮荆而引瓯ōu越。物华天宝龙光射牛斗之墟人杰地灵徐孺下陈蕃之榻tà。雄州雾列俊采星驰。台隍枕夷yí夏之交宾主尽东南之美。都督阎公之雅望棨qǐ戟jǐ遥临宇文新州之懿yì范襜chān帷暂驻。十旬休假胜友如云千里逢迎高朋满座。腾蛟起凤孟学士之词宗紫电青霜王将军之武库。家君作宰路出名区童子何知躬逢胜饯。/emhrstrong时维九月序属三秋。/strong潦水尽而寒潭清烟光凝而暮山紫。俨骖cān騑fēi于上路访风景于崇阿。临帝子之长洲得天人之旧馆。层峦耸sǒng翠上出重霄xiāo飞阁流丹下临无地。鹤汀tīng凫fú渚穷岛屿之萦yíng回桂殿兰宫即冈峦之体势。/body
/html 1.2.2ins与del标签
!DOCTYPE html
htmlheadmeta charsetutf-8title文本标签/title/headbodyh1新增与删除标签/h1del999/delins100/ins/body
/html 1.2.3.sub与sup上下标线
!DOCTYPE html
htmlheadmeta charsetutf-8title文本标签/title/headbodyh1上下标线标签/h12sup10/sup 1024brHsub2/subO/body
/html 1.2.4span标签
!DOCTYPE html
htmlheadmeta charsetutf-8title文本标签/title/headbodyh1上下标线标签/h1span stylecolor: blue;2sup10/sup 1024/spanbrHsub2/subO/body
/html 1.3图片标签
标签名语义和功能属性单标签还是双标签img引入图片src设置图片地址。bralt设置图片替代文字。brwidth设置宽度。brheight设置高度单标签 1. alt 设置图片替代文字当图片无法正常显示显示alt中的文字 2. 如果单独设置宽度或者高度另一个方向根据比例自动计算。同时设置宽高容易导致图片拉伸失真。 !DOCTYPE html
htmlheadmeta charsetutf-8title文本标签/title/headbodyh1图片标签/h1img srcpics/0d40c24b264aa511.jpg alt华为手机/body
/html 1.3.1 base64 图片
base64编码工具 https://tool.chinaz.com/tools/imgtobase/ 1. 本质一串特殊的文本要通过浏览器打开传统看图应用通常无法打开。 2. 原理把图片进行 base64 编码形成一串文本。 3. 如何生成靠一些工具或网站。 4. 如何使用直接作为 img 标签的 src 属性的值即可并且不受文件位置的影响。 5. 使用场景一些较小的图片或者需要和网页一起加载的图片。 1.3.2相对路径和绝对路径
以当前代码所在的文件夹为起点
1.3.2.1绝对路径
1.3.2.1.1网络绝对路径
目标文字在网上的绝对地址如https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png前端开发主要使用网络绝对路径。
1.3.2.1.2本地绝对路径
目标文字在计算上的绝对地址, 如 E:\WebProjects\html\pics后端开发主要使用本地绝对路径。
1.3.2.2相对路径 ./ 当前目录当前文件所在的目录 ./可以省略 如果目标文件在同级或者下级 ../ 上级目录当前文件的上级目录 如果目标文件在上级或者先进入上级再访问所在目录 ../../ 上上级 ../../../ 上上上级 1. img 标签引入图片 2. 超链接设置目标文件 3. video 标签引入视频 4. audio 标签引入音频 5. iframe 标签引入各种类型的文件 6. link 标签关联 css 文件 7. script 标签引入 js 文件 1.4超链接和锚点
标签名语义和功能属性单标签还是双标签a超链接 href设置目标文件地址。 target设置目标文件在哪个窗口打开 双标签 target 属性设置目标文件在哪个窗口打开默认值是 _self,表示本窗口打开可以设置为 _blank, 表示新窗口打开 1.4.1超链接
1.4.1.1目标文件是网页
!DOCTYPE html
htmlheadmeta charsetutf-8title超链接标签/title/headbodyh1超链接标签/h1!-- _blank设置新窗口打开 --a hrefhttps://www.baidu.com/ target_blank百度/abr链接自己的网页a hrefindex.html自己的网页/a/body
/html 1.4.1.2目标文件是网页以外的其他类型文件 a href./resouces/小乐老师的业余生活.jpg[图片]小乐老师的业余生活/a br a href./resouces/如何30岁之前走上人生巅峰.pdf[pdf]如何30岁之前走上人生巅峰/a br a href./resouces/小乐老师的性福生活.mp4[视频]小乐老师的性福生活/a br a href./resouces/如何拥有百亿资产.docx[word文件]如何拥有百亿资产/a br a href./resouces/小乐老师的私房照片.7z[压缩文件]小乐老师的私房照片/a 目标文件分为两种 浏览器能够打开 点击超链接浏览器直接打开如网页文件、图片文件、视频文件、pdf文件等 浏览器无法打开 点击超链接直接下载
1.4.1.3超链接唤起指定应用 a hreftel:10086打电话/a br a hrefsms:10010发短信/a br a hrefmailto:fumingatguigu.cn发邮件/a 1.4.1.4href 的值是空的点击刷新 a href刷新/a 1.4.2锚点
1.4.2.1如何设置锚点 给标签设置一个唯一的ID属性该标签就成为一个锚点ID的属性值就是锚点的名字 div id锚点名/div
p id锚点名/p
hr id锚点名1.4.2.2如何跳转到锚点通过超链接跳转到锚点
!-- 跳转到本页面的锚点 --
a href#锚点名/a!-- 跳转到其他页面的锚点 --
a href页面地址#锚点名/a!-- 跳转到页面顶部 --
a href#/a
