一个域名可以做几个网站吗,南城网站建设公司,云开发控制台,wordpress站点改名文章目录 1.认识HTML2.html 框架3.HTML常见标签4.HTML语法特征5.列表 1.认识HTML
html是超文本标记语言: 目前最新版本是html5,由w3c(万维网联盟)完成标准制定。 声明文档的类型是html5 超文本标记语言。
HTML #xff0c;全称“Hyper Text Markup Language#xff08;超文… 文章目录 1.认识HTML2.html 框架3.HTML常见标签4.HTML语法特征5.列表 1.认识HTML
html是超文本标记语言: 目前最新版本是html5,由w3c(万维网联盟)完成标准制定。 声明文档的类型是html5 超文本标记语言。
HTML 全称“Hyper Text Markup Language超文本标记语言”简单来说网页就是用HTML语言制作的。HTML是用来描述网页的一种语言 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本添加图片创建链接、输入表单、框架和表格等等并可将之存为文本文件浏览器即可读取和显示。
何为超文本? 文本只是单纯的显示字符串,超文本还可以显示音频,视频,图片,对内容可以有不同样式的调整,即是超文本.
发展历史: ①HTML 1.0在1993年6月作为互联网工程工作小组(IETF)工作草案发布。 ②HTML 2.01995年1 1月作为RFC 1866发布于2000年6月发布之后被宣布已经过时。 ③HTML 3.21997年1月14日W3C推荐标准。 ④HTML 4.01997年12月18日W3C推荐标准。 ⑤HTML 4.01微小改进1999年12月24日W3C推荐标准。 ⑥HTML 5HTML5是公认的下一代Web语言,是HTML最新的修订版本 2014年10月由W3C(制定Web技术标准的机构)制定。
html如何识别? html超文本标记语言,在b/s架构的服务中,利用http超文本传输协议,让浏览器进行解析,http独占80端口. http: 超文本传输协议 (对html标记语言,传输解析的标准) https: 加密版超文本传输协议 443 浏览器: 超文本的解析器 2.html 框架
!-- -- 表示html注释
!--
html : 网页的骨架
css : 网页的样式
js/jq: 网页的动作
--!DOCTYPE html 声明文档的类型是html 超文本标记语言
htmlhead此处写入web网页的配置信息/headbody此处写入网页的主体内容font colorred size5 学习html /font #目前font标签已被淘汰/body/html将html文件拉到浏览器使用的是file协议
使用vscode 的open with live server打开的是http协议
3.HTML常见标签
font,meta,br,hr,pre,h1~h6,sub,p,strong,em sub,sup,div,span,ul,ol,dl,a,img, table,form,input,iframe
HTML标签种类
块状元素: 独占一行,可直接设置宽高例如:h1~h6,div,p,ul,ol,dl,li,table,form ..
行内元素: 不能独占一行,不能直接设置宽高例如:span,a,label,strong,em
行内块状元素: 不能独占一行,可直接设置宽高例如:img,button,input4.HTML语法特征
1.内容不区分大小写 2.标签结构分为单闭合、双闭合标签(标签成对显示) 3.一个及多个空白符,都会被理解成一个空白符 页面代码写了多个空白符
网站页面只显示一个空白符
body里面写标签大于号小于号页面不会解析 换行标签 !-- 分割线标签 -- 一般是做演示的时候用hr /字符实体:使用字符实体来表达实际的字符含义;
nbsp; 使用字符实体表达多个空格: lt; 小于号 gt; 大于号
例子:
5lt;d cgt;10!-- 格式化预览标签 原型化输出所有内容 pre --pre333444------777/pre如果不加pre标签则显示不出效果并列显示了
!DOCTYPE html
htmlhead!--设置编码集meta是单标签--meta charsetutf-8 /!--设置网站标题--title这是前端界面/title!--设置网站显示的图标--!-- http://www.bitbug.net/ 制作小图标的网址--link relshortcut icon hrefhttps://g.csdnimg.cn/static/logo/favicon32.ico/!-- 设置搜索排名权重分配使用keywordscontent里面配置相关搜索的关键字 --meta namekeywords content新浪,新浪网,SINA,sina,sina.com.cn,新浪首页,门户,资讯 /!-- 设置搜索引擎抓取页面的描述信息使用description --meta namedescription contentCSDN是全球知名中文IT技术交流平台,创建于1999年,包含原创博客、精品问答、职业培训、技术论坛、资源下载等产品服务,提供原创、优质、完整内容的专业IT技术开发社区.!-- 设置几秒之后页面跳转,content 设置等待几秒刷新或跳转跳转的urlurl必须要写协议 --!-- meta http-equivrefresh content3;urlhttp://www.baidu.com / --/headbody!-- 一个及多个空白符,都会被理解成一个空白符 --1111 3333 343434 234234!-- 换行标签 --br /3d c10nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;11111!-- 分割线标签 --hr /5lt;d cgt;10br/!-- 格式化预览标签 原型化输出所有内容 pre --!-- pre --333444------777!-- /pre --/body
/html常见标签
!DOCTYPE html
htmlheadmeta charsetutf-8/title 常见标签 /title/headbodyh1一级标签/h1 #最多6级超过6就当做字符串显示了h2二级标签/h2h3三级标签/h3h4四级标签/h4h5五级标签/h5h6六级标签/h6hr /!-- 下角标 sub --h20 hsub2/sub0br /
co2 cosub2/subbr /
!-- 上角标 sup --
x2 100 xsup2/sup 100!-- p 是段落标签 --
p这是第一个段落/p #一般段落我们用div标签p标签一般塞入文章
p这是第二个段落/p
hr /!-- (了解)逻辑强调 带有语义话的含义 [w3c标准] 推荐--
strong川普是我的偶像/strongem我的爱人/em!-- (了解)物理强调 带有语义话的含义 [非w3c标准] w3c之前用的是b标签--b川普是我的偶像/bi我的爱人/i/body/html块状标签行内标签
!DOCTYPE html
html langen
headmeta charsetUTF-8!-- 指定移动端缩放比例适配不同屏幕大小 --meta nameviewport contentwidthdevice-width, initial-scale1.0title标签的种类/title
/head
body!--标签的种类:(1) 行内元素标签: 不能独占一行,不能设置宽和高,横向排列例子: span a(2) 块状元素标签: 独占一行,可以设置宽和高,纵向排列例子: div h1~h6 p(3) 行内块状标签: 不能独占一行,能设置宽和高,横向排列例子: button img inputspan 和 div 都属于无语义化标签,用来布局页面,划分页面结构--!-- 行内元素 --span stylewidth:200px;height:200px;background-color:yellowgreen;我爱你 span奥斯托夫罗斯基/span /span 111设置宽和高无效换行无效 我是网页的头部 我是网页的身体 我是网页的脚部 div独立成行100%横跨整个页面 按我1 按我2 按我3
行内块状标签不能独占一行,能设置宽和高,横向排列
/body
/html5.列表
浏览器右键检查或者按F12打开调试窗口点击小箭头鼠标在网页放的位置可以找到对应代码
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleDocument/title
/head
body!-- ul 是无序列表 里面的小选项用li 包起来*** --!-- square 方块 circle 空心圆 --ul typesquareli姜子牙/lili我和我的家乡/lili八百/lili唐人街探案3/li/ul列表左边的标志类型可以设置一般不用。原形态默认实心圆
方块
空心圆 姜子牙我和我的家乡八百唐人街探案3
默认有序列表 起始值可以设置一般不用 定义列表和有序列表用的都没无序列表ul用的频繁 女生曾经说过的谎言: 不要 你真坏 你是个好人 我给你介绍个漂亮的小姑娘 定义列表文字方式
/body
/html总结html标签理解起来比较简单经常运用就比较熟悉了零基础也能很快掌握小伙伴们尝试一下吧
