首页 / 知识

HTML核心入门精选知识分享

2023-04-11 13:49:00

HTML核心入门精选知识分享
　　超文本标记语言（Hyper Text Mark Language），简称HTML，是一种用于创建网页的标准标记语言。
 
　　一、开发工具
 
　　vs code:全栈开发工具
 
　　Hbuilder:纯前端开发工具
 
　　sublime:纯文本编辑器，可配置成强大的开发工具
 
　　二、浏览器渲染原理
 
　　浏览器本质上是一个渲染引擎，可以把html代码渲染成人类更容易接受的符号。
 
　　三、标准文档结构
 
　　HTML文档结构是一个html元素为根节点，其下包含head和body。
 
　　head标签用于告知浏览器渲染器的相关配置。body才是浏览器需要渲染的内容。
 
　　三、HTML核心标签
 
　　HTML标签根据排版的不同可以分为两种：
 
　　块标签（block tags）
 
　　[1] 独占一行，垂直方向排序。
 
　　[2] 可以设置宽高，
 
　　行内标签（inline tags）
 
　　[1] 在一行内并排排序，水平方向排列
 
　　[2] 不能设置宽高，内容撑开宽高
 
　　有语义标签
 
　　标签有特定的含义，例如显示图片的标签img，播放音频的标签audio，播放视频的标签video。有语义标签不能用在其他用途。
 
　　无语义标签
 
　　标签没有特定含义，标签什么都可以显示，一般作为容器，可以用于页面布局。例如：div/span等。
 
　　3.1 块标签
 
　　3.1.1 div
 
　　无语义标签块标签，一般作用容器用于页面布局。
 
　　3.1.2 标题
 
　　通过<h1> - <h6> 标签来定义，字号从大到小
 
　　<h1>我是标题</h1>
 
　　<h2>我是标题</h2>
 
　　3.1.3 段落与换行
 
　　<p>我是段落</p>
 
　　12 <br /> 换行
 
　　34
 
　　3.1.4 HTML列表
 
　　<ol>（orderid list） 表示有序列表
 
　　<li>表示列表项，必须位于ol中
 
　　<ul>（unordered list） 表示无序列表
 
　　<li>表示列表项，必须位于ul中
 
　　<dl>表示定义列表  defined list
 
　　<dt>表示定义标题  defined title
 
　　<dd>表示对自定义标题的描述  defined description
 
　　3.1.5 HTML表格
 
　　表格table是由行（tr）构成的，行是由列（td）构成的。
 
　　合并单元格
 
　　colspan:单元格向右跨越几列
 
　　rowspan:单元格向下跨越几行
 
　　向右跨3列向下跨3行
 
　　3.2 行内标签
 
　　3.2.1 span
 
　　无语义行内标签，作为容器使用。
 
　　3.2.2 HTML链接
 
　　通过标签<a>来定义
 
　　<a href="">这是一个链接</a>
 
　　在 href 属性中指定链接的地址。
 
　　绝对路径：从盘符开始的路径就是绝对路径。
 
　　相对路径：没有盘符，从当前路径开始。当前操作的文件所在的路径就是当前路径，用。表示。
 
　　3.2.3 锚点
 
　　页面内跳转成为锚点
 
　　#与id
 
　　3.2.4 HTML图像
 
　　通过标签<img>定义
 
　　3.2.5 strong/em/var
 
　　这三个都表示强调。
 
　　实际开发过程中，三个标签会被降级成无语义标签用于容器。
 
　　作为后台开发人员，如果需要没见过的标签=> 测试属于行内标签还是块标签。
 
　　四、form表单
 
　　HTML 表单用于收集不同类型的用户输入，向后台提交数据。

分享核心知识超文本开发工具标记语言

最新内容

相关内容

热门文章

推荐文章

标签云

猜你喜欢