文章目录 前言 块级元素 行内元素 行内块级元素 ---- 前言 HTML中的标记 块级元素 h1-h6>>1-6级标题 p>>段落 div>>定义文档中的节 ul>>定义无序列表 ol>>定义有序列表...fieldset>>定义围绕表单中元素的边框 legend>>定义 fieldset 元素的标题 figure>>定义媒介内容的分组,以及它们的标题。...(脚注) tr>>定义表格中的行 th>>定义表格中的表头单元格 colgroup>>定义表格中供格式化的列组 col>>定义表格中一个或多个列的属性值。...比如章节、页眉、页脚或文档中的其他部分 article>>定义文章 aside>>定义页面内容之外的内容。【可用作文章的侧栏。】 datails>>定义元素的细节。...>>定义命令按钮 style>>定义文档的样式信息 span>>定义文档中的节 base>>定义页面中所有链接的默认地址或默认目标 行内块级元素 img>>定义图像 input>>定义输入控件
布局标记 首先要介绍的布局标记是div标记,div可以做网页的层也可以做网页的分区。当div做网页的层时可以实现漂浮在网页上的效果,就像我们经常可以在网站里看见的那些漂浮广告。...从运行结果就可以看出,一个div就占它所设定的大小,每个div都是分开的,将网页分成了一个个的块。...table标记和div标记一样都是属于网页布局的标记,table主要是用来做表格,table里常用的属性是:border表格的边界线、cellpadding 表格的填充程度、cellspacing 内间距距离...DOCTYPE html> <table border...列表标记 首先要介绍的第一个列表是ul无序列表,无序列表是一个项目的列表,此列项目使用粗体圆点(典型的小黑圆圈)进行标记,ul需要嵌套li实现列表效果。
多媒体标记 在html中可以使用多媒体标记来在网页上播放音频文件,或者显示一些好看的图片用来装饰网页。Flash文件也可以通过相应的标记显示在网页上,标签是用于在网页上播放视频文件的。...像新闻或者某些有图片的文章就会用到这种效果。 热点标记:在img标签还有一个应用:设置图片热点,当你点击图片中的热点时就会跳转到指定的页面中。...有使用过的网银的人都知道,在登录账户或者进行转账交易的时候,都会需要下载或更新一个安全控件,这个控件就是一个插件,也是使用标签来引入的。 思维导图: ? 多媒体标记思维导图总结: ?...框架标记 其实框架就在能够在一个窗口中嵌套几个网页显示,框架标记有iframe、frame、frameset,后面的两个基本上是淘汰了,只有iframe会用得。...iframe应用的比较多的原因,是因为需要把一些经常要更新的内容和几乎不怎么更新的内容分离开来,例如像图片上的文章就基本不会更新的,而旁边的广告则经常要更新,如果不分离开将这两种类型的页面放在一块的话,
一、a标签的语法 链接显示内容 target值: _blank在新窗口中打开...二、链接的种类 1.内部链接(当前文档与目标文档在同一站点内); 2.外部链接(当前文档与目标文档不在同一站点内); 3.E-mail链接(并允许访问者向指定的地址发送邮件); 4.锚点连接 跳转到同一网页或其他文档的指定位置:创建锚点...,显示内容链接锚点,显示内容; 5.空链接,就是没有目标端点的链接,显示内容...; 6.脚本链接:是一种特殊的链接,当单击设置脚本链接的文本或图像时,可以运行相应的JS语句。
HTML标记的类型:单标记与双标记 一.单标记 (1). 单一型,无属性值。 如: 在xhtml中,规定,所有HTML标记,都要小写,所有的标记都要有关闭。 (2).... 单一型,有属性值。 如: 二.双标记 (3).... 没有属性值。 如:......... 有属性。 如:... 说明: 标记与属性,属性之间以空格分隔。...属性不区分先后顺序;且属性不是必要的。
一、HTML标记类型 1.单标记 语法:,如:、、 2.双标记 语法:…标记内容…,如:这是百度的主页 二、HTML标记属性 语法: 或 。...虽然在HTML中不区分大小写,但是在XHTML中所有的标记确是严格区分大小写的。...三、HTML主要标记解析 1.html标签 和用来标识网页文件的开始和结束,所有的html都必须放在这对html标记中。...四、HTML中的特殊字符 © :表示版权号 ® :表示注册商标 五、部分HTML元素详解 1.span和div的区别: span只是将内容逻辑上包在一起,不改变原样式,可以不是一个规矩的块
1.特殊符号(w3c规定特殊符号要用html实体实现) 1. 代表一个空格 and 2.© 代表版权 3....¥ 代表人民币符号 2.文本标记 1.文本样式标记 超链接标记 字体加粗标记 ...字体加粗标记 斜体标记 下划线标记 删除线标记...-- 注释内容 --> 注释 2.标题标记 ... n代表1-6 ......原文地址《html常用标签标记》 分享到:更多
DOCTYPE html> HTML5...基本标记 头标记<head> 标题标记<title>用来说明网页的用途... 元信息标记<meta>提供有关页面的元信息,比如搜索引擎和更新频度的描述和关键词。 ...目前由于SEO优化滥用, 现在keywords起到的作用并不是那么大了。
一、表单的作用 从访问的Web站点的用户那里获得信息。访问者可以使用诸如文本域、列表框、复选框以及单选按钮之类的表单元素输入信息,然后单击某个按钮提交这些信息。是客户端与服务器端的交流途径。...二、说明 Form标记用于创建一个表单,定义一个表单的开始与结束,他是一个容器,用于包含其他元素,例如文本框、单选框等。表单元素必须在form标记内才有作用。 ...form> 注意:post方法可以传递大量信息,get将值附加到请求的url中,适合少量的信息。...三、表单元素标记 ①.单行文本 标注内容标签:为input元素定义标注(标记),标签的for属性应当与相关元素id相同 如:<input type=”redio” name=”sex”
除此之外,HTML5能够支持不同终端,不同尺寸的屏幕,在跨平台上更加方便了,不局限于PC。HTML5相对于HTML4,增加了很多新标记,并且语法也更简洁了,将原本HTML4的一些过时的标记去除了。...HTML5标记 HTML5是一个超文本标记语言,我们学习html就是学习这些标记,标记里还有许多的属性,但是这些属性在很多标记里都是相通的,有大概70%的相通性。...现在我们来看一些标记的格式: 第一种写法: :标记的开始 :标记的结束 在html里并不严格区分大小写,所以大写也是可以的: :标记的开始 :...接下来第二个标记就是html,这是根标记也称之为根元素,在一个html文件里,根标记只需要写一个即可,不要写多个,所有的标记内容都嵌套在根标记内,这类似于Java的类的大括号,所有的静态、实例成员都写在类的大括号里...以上就是html头部分的一些标记与属性还有关键字的介绍,接下来进入到body标记的学习,body标记里面就是网页的内容,前面我们也在body标记里写了一句Hello World,运行后在网页上就能显示出来
”> …… type的可取值...:定义一个项目下更详细的内容解释。
仅供学习,转载请注明出处 html块标签 1、 标签 块元素,表示一块内容,没有具体的语义。 2、 标签 行内元素,表示一行中的一小段内容,没有具体的语义。...DOCTYPE html> 胖子老板:肥仔白,买包槟榔啦!... 浏览器展示如下: ?...语义化的标签 语义化的标签,就是在布局的时候多使用有语义的标签,搜索引擎在爬网的时候能认识这些标签,理解文档的结构,方便网站的收录。
语法与语义: 和定义表格的开始和结束 和定义表格头部的开始和结束 和定义表格主体开始和结束 和定义表格脚注的开始和结束 和定义表行的开始和结束 和定义表列(单元格)的开始和结束 定义标题栏,和级别相同(...,默认值为2 cellspacing 设置单元格之间的距离,默认值为2 bodercolor 设置边框颜色 bodercolorlight 置边框亮部分的颜色(boder大于等于1时有效)...5.细线表格效果的实现原理 1.将表格的boder设为0. 2.给表格设置背景颜色为细线颜色 3.給表格设置单元格背景为白色 4.給表格设置单元格之间的距离为细线宽度 6...hsides 只显现表格上下边线 vsides 只显现表格左右边线 lhs 只显现表格的左边线 vhs 只显现表格的右边线 border/box 显现表格的所有边线 rules
行元素:整行排列,不能改变大小(宽度和高度),宽度默认文字宽度,当行元素排列过多时( 超过浏览器的宽度时自动强制换行 )。 块元素:一个块元素独占一行,宽度默认浏览器的宽度,可以改变宽度和高度。...行内块元素:属于行元素,但又有块元素的属性,横行排列但又可以设置宽度和高度。...定义键盘文本 标签为 元素定义标注(标记) 定义短的引用 定义样本文本 创建单选或多选菜单 呈现小号字体效果 组合文档中的行内元素...定义无序列表 标签定义段落 定义预格式化的文本 标签定义 HTML 表格 标签表格主体(正文) 表格中的标准单元格 定义表格的页脚...原文地址《HTML的行元素和块元素》
---- HTML 是用来描述网页的一种语言,包含 HTML 标签和纯文本,HTML 文档也被称为网页。 Web 浏览器的作用是读取 HTML 文档,并以网页的形式显示出它们。...浏览器不会显示 HTML 标签,而是使用标签来解释页面的内容 1) HTML 指的是超文本标记语言 (Hyper Text Markup Language) 2) HTML 不是一种编程语言,而是一种标记语言...(markup language) 3) 标记语言是一套标记标签 (markuptag) 4) HTML 使用标记标签来描述网页 -3rd- HTML 标签 ---- 01 概述 HTML...标记标签通常被称为 HTML 标签 (HTML tag)。...HTML 标签是块级元素,用于组合其他 HTML 元素的容器,定义文档中的分区或节(division/section)。 元素没有特定的含义。
3.CSS文本相关样式 3.1 font-size 字号大小 它的属性用于设置字号 相对长度 em px 最常用,推荐使用 3.2 font-family 字体 它的属性用于设置字体 p{font-size...,但是CSS 是没有语义的。...font-weight属性用于定义字体的粗细,其可用属性值:normal、bold、bolder、lighter、100~900(100的整数倍)。...font-style属性用于定义字体风格,如设置斜体、倾斜或正常字体,其可用属性值如下: normal:默认值,浏览器会显示标准的字体样式。 italic:浏览器会显示斜体的字体样式。...oblique:浏览器会显示倾斜的字体样式。
img src=”xxx.jpg”alt=”xxx”title=”xxx”> 属性可取值如下: 属性名称 属性值 说明 src URL 图片路径 alt 文本 图片无法显示时的文本...title 文本 鼠标停留时显示的内容 width 像素/百分比 设置图片宽度 height 像素/百分比 设置图片高度 border 数字 设置图像边框 align left...图片靠左,文字靠右 right 图片靠右,文字靠左 top 文字垂直居上靠 bottom 文字垂直居下 middle 文字垂直居中 vspace 像素 定义图像顶部和底部的空白(垂直边距...) hspace 像素 定义图像左侧和右侧的空白(水平边距)
HTML图像标记 1.图像标记 1.1 src指定图像文件的路径和文件名,它是img标记的必需品。...1.3 图像的宽高属性 width,height 两者不能同时使用 1.4 图像的边框的属性 border :可以为图像添加边框,设置边框的宽度,但边框颜色的调整仅仅通过HTML属性时不能通过的。...1.5 图像的边距属性 vspace 和hspace 1.6图像的对齐方式用align表示 2.相对路径和绝对路径 1.绝对路径 绝对路径一般是指带有盘符的路径 <img src="D:\<em>html</em>...\chapter02\img\laopo.jpg" 2.绝对路径 2. 1 图像文件和html 文件位于同一文件夹:只需输入图像文件的名称即可 2.2 图像文件位于html文件的下一级文件夹:输入文件夹名和文件名...,之间用”/“隔开 2.3图像文件位于html 文件的上一级文件夹:在文件名之前加入”..
---- theme: channing-cyan 这是我参与8月更文挑战的第24天,活动详情查看:8月更文挑战 今天我们说一下插入标记,我们熟悉的插入有innerHTML,其实还有几种和他类似的方法,...插入标记 我们之前用的api大多数都是获取元素内容,HTML5规范中定义了一个向标签元素内添加内容的方法。...innerHTML innerHTML是向元素内插入一个字符串,注释或者文本标记,它会根据现在提供的内容重新渲染到DOM树上,替代之前元素包含的所有节点。...性能问题 我们虽然这样操作的话会比我们修改HTML中的内容方便,但是我们修改的内容如果还有其他绑定js事件或者操作,就会导致内存占用比较大,我们在用的时候一定要注意被替换的元素上所关联的js事件。...,里面可能写一些烂七八糟的内容导致我们页面程序瘫痪。我们在用innerHTML的时候一定要进行转义或者隔离插入的数据。
1 第一章 2 标签: 3 <meta http-equiv=”Content-Type” Content=”text/html...标签:超链接 45 46 链接到其他页面: 47 链接到本页面: 48 fghgg-----创建锚标记...91 92 2、设置导航栏中的超链接的target目标窗口属性,使其值为框架窗口的名字 93 94 95 4个特殊的窗口: 96 Target可以取4个值--------_blank (新启一个窗口打开链接...Padding-bottom 与下边框的距离 131 132 133 特殊样式: 134 A:link{} 未被访问的链接样式 135 A:visited{} 已被访问过的链接样式
领取专属 10元无门槛券
手把手带您无忧上云