-
2017-09-09 14:34:00
HTML常用的标记语言
标记语言:是一种讲文本以及相关的其他信息结合起来,展现出关于文档结构和数据处理细节的电脑文字编码。与文本相关的其他信息(包括文本的结构和表示信息等)与原来的文本结合在一起,但是使用标记进行标记。
标记语言不仅仅是一种语言。就像许多语言一样,它需要一个运行时环境,使其有用。
现在来学习我们常用一些标记
1、无序列表:
<ul>
<li>我是无序列表<li>
<li type="circle">我是无序列表</li>
<li type="square">我是无序列表</li>
<li>我是无序列表</li>
<li>我是无序列表</li>
</ul>
2、有序列表:
<ol>
<li>有序列表</li>
<li>有序列表</li>
<li>有序列表</li>
<li>有序列表</li>
</ol>
3、自定义列表:
<dl>
<dt>我是标题</dt>
<dd>我是内容<dd>
</dl>
4、插入图片、超链接:
<imgwidth="50" height="40"src="img/a.img"/> (插入图片、设置其宽高)
<a href="http://www.baidu.com"target="_blank">百度</a> (新窗口打开百度链接,target:选择打开的方式)
格式:<imgsrc=""/>
功能:在网页中插入图像。
绝对路径和相对路径的区别:
绝对路径:可以理解为一个网址。文件图片等已经上传服务器;
相对路径:存在同一个目录下的相对路径。
src="url" 通过url给出图像来源的位置,是不可缺省的
width="size" 设置图像宽高
height="size" 设置图像高度
alt="txt" 设置在图像未载入前图片位置显示的文字
border="size" 设置图像边框,缺省为0
align="alignstyle" 设置对其方式,取值为: topbottom left right middle center
hspace="size" 设置图片左右边沿空白
vspace="size" 设置图片上下边沿空白
5、表格:table
table:表格
th:表格单元格标题
tr:表格行
td:表格列
caption:表格标题
thead:表头
tbody:表主体
tfboot:表尾
<table border="1"width="600" align="center">
<caption></captiom>
<thead>
<tr>
<th>表格单元格标题</th>
<th>表格单元格标题</th>
<th>表格单元格标题</th>
</tr>
</thead>
<tbody align="center">
<tr>
<td>一</td>
<td>二</td>
<td rowspan="2">行合并</td>
</tr>
<tr>
<td>一</td>
<td>二</td>
</tr>
</tbody>
<tfoot><tr><td colspan="3">表尾列合并</td></tr></tfoot>
</table>
表单:form
form:表单,把控件集中起来
input:控件
input(标签) - type(属性)-(作用如下)
text:文本框
password:密码框
hidden:隐藏域
radio:单选框
checkbox:多选框
button:按钮
reset:重置
image:图片按钮
submit:提交
<input type="text"placeholder="输入你的用户名">(placeholder:框内的提示信息)
<input type="password"placeholder="请输入你的密码">
<input type="button"value="登录">
form标签:
为什么占击reset没有效果啊?
因为type=resrt的按钮智能在Form之中起作用。
作用:用来管理页面上的表单元素,表单元素如果要起作用,必须要放在form标签中。
action:讲所有的数据提交到action指定的页面
更多相关内容 -
标记语言——CSS布局
2020-12-12 07:12:17上文:标记语言——打印样式。 Chapter 12 CSS布局 本书到此为止,讨论的主要是页面内部元素,也就是内容,但是大结构怎么办?长久以来,设计者都依赖表格进行分栏布局,常常在表格之内嵌套其他表格以便达成恰巧正确的间隔... -
HTML标记语言
2019-08-06 17:17:031、HTML标记语言 HTML的全称是Hyper Text Markup Language,即超文本标记语言。HTML是一种在互联网上常见的网页制作标记性语言,HTML用于描述超文本中内容的显示方式。使用 HTML 可以实现在网页中定义一个标题、...1、HTML标记语言
HTML的全称是 Hyper Text Markup Language,即超文本标记语言。HTML是一种在互联网上常见的网页制作标记性语言,HTML用于描述超文本中内容的显示方式。使用 HTML 可以实现在网页中定义一个标题、文本或者表格等。严格的说,HTML 并不能算作是一种程序设计语言,因为它缺少了程序设计语言所应有的特征。HTML是通过浏览器的翻译,将网页中的内容呈现给用户的。
1.1 创建第一个HTML文件
编写HTML文件可以通过两种方式:一种是手工编写HTML代码,另一种是借助一些开发软件。在 Windows 操作系统中,最简单的文本编辑软件就是记事本。
示例:使用记事本创建一个HTML文件。
(1)创建一个记事本文件。
(2)打开记事本文件,输入以下HTML代码:
<html> <head> <title>创建第一个HTML文件</title> </head> <body> <b>您好!欢迎访问 pan_junbiao的博客</b><br> <b>博客地址:https://blog.csdn.net/pan_junbiao</b><br> <b>这是使用记事本编写的HTML文件</b> </body> </html>
(3)修改记事本文件名称,将文件的后缀名修改为 .html,如:01.html。
(4)运行文件,执行结果如下:
1.2 HTML文档结构
HTML 文档由4个主要标记组成,这4个标记是<html>、<head>、<title>和<body>。它们构成了HTML页面最基本的元素。
标记 说明 <html>标记 <html>标记是 HTML 文件的开头。所有HTML文件都是以<html>标记开头,以</html>标记结束。HTML 页面的所有标记都要放置在<html>与</html>标记中,<html>标记并没有实质性的功能,但却是HTML文件不可缺少的内容。 <head>标记 <head>标记是 HTML 文件的头标记,作用是放置HTML文件的信息。如定义 CSS 样式代码可放置在<head>与</head>标记中。 <title>标记 <title>标记文标题标记。可将网页的标题定义在<title>与</title>标记中。 <body>标记 <body>标记是 HTML 页面的主体标记。页面中的所有内容都定义在<body>标记中。<body>标记也是成对使用的,以<body>标记开头,以</body>标记结束。<body>标记本身也具有控制页面的一些特性,例如控制页面的背景图片和颜色等。 说明:HTML标记是不区分大小写的。
1.3 <meta>标记
<meta>标记可提供有关网页的信息(meta-information),<meta>标记出现在网页的标题部分。<meta>标记提供的信息包括作者姓名、公司名称和联系信息等。许多搜索引擎都要使用此信息。META标签使用属性/值的组合。
1.3.1 设置网站的作者(author)
示例:在页面中将“pan_junbiao的博客”指定为作者。
<meta name="author" content="pan_junbiao的博客">
1.3.2 设置网站的关键字(keywords)
"keywords" 是一个经常被用到的名称。它为文档定义了一组关键字。某些搜索引擎在遇到这些关键字时,会用这些关键字对文档进行分类。
示例:设置网站的关键字。
<meta name="keywords" content="Java,C#,Oracle,MySQL">
1.3.3 网页过期(expires)
示例:设置网页过期。
<meta http-equiv="expires" content="Wed, 26 Feb 2019 08:21:57 GMT">
1.3.4 自动刷新(refresh)
示例:设置网页自动刷新。
<meta http-equiv="refresh" content="30">代表每隔30秒自动刷新本页面 <meta http-equiv="refresh" content="5; url=https://blog.csdn.net/pan_junbiao">代表过5秒自动跳转到新的url网址
1.3.5 解决页面中文乱码
<meta charset="UTF-8">
2、HTML常用标记
HTML中提供了很多标记,可以用来设计页面中的文字、图片,定义超链接等。这些标记的使用可以使页面更加的生动,下面为大家介绍HTML中的常用标记。
2.1 换行标记
在HTML语言中,换行标记为<br>。与前面介绍的HTML标记不同,换行标记是一个单独标记,不是成对出现的。
示例:创建HTML页面,在页面中使用换行标记。
<html> <head> <title>应用换行标记实现页面文字换行</title> </head> <body> <b>您好!欢迎访问 pan_junbiao的博客</b><br> <b>博客地址:https://blog.csdn.net/pan_junbiao</b><br> 所有的努力都不会完全白费,你付出多少时间和精力,都是在对未来的积累。<br> 世界上什么都不公平,唯独时间最公平,你是懒惰还是努力,时间都会给出结果。 </body> </html>
执行结果:
2.2 段落标记
HTML中的段落标记也是一个很重要的标记,段落标记以<p>标记开头,以</p>标记结束。段落标记在段前和段后各添加一个空行,而定义在段落标记中的内容,不受该标记的影响。
2.3 标题标记
要在HTML页面中创建不同级别的标题,可以使用HTML语言中的标题标记。在HTML标记中,设定了6个标题标记,分别为<h1>至<h6>,其中<h1>代表1级标题,<h2>代表2级标题,<h6>代表6级标题等。数字越小,表示级别越高,文字的字体也就越大。
示例:在HTML页面中使用标题标记。
<html> <head> <title>标题标记</title> </head> <body> <h1>您好,欢迎访问 pan_junbiao的博客</h1> <h2>您好,欢迎访问 pan_junbiao的博客</h2> <h3>您好,欢迎访问 pan_junbiao的博客</h3> <h4>您好,欢迎访问 pan_junbiao的博客</h4> <h5>您好,欢迎访问 pan_junbiao的博客</h5> <h6>您好,欢迎访问 pan_junbiao的博客</h6> </body> </html>
执行结果:
2.4 文本格式化标记
标签 示例 <B>标签 <B>该文本将以粗体显示</B> <I>标签 <I>该文本将以斜体显示</I> <U>标签 <U>该文本将显示为带有下划线</U> <SUB>标签 <SUB>该文本的显示高度将低于前后的文本</SUB> <SUP>标签 <SUP>该文本的显示高度将高于周围的文本</SUP> 示例:在HTML页面中使用文本格式化标记。
<html> <head> <title>文本格式化标记</title> </head> <body> <B>您好,欢迎访问 pan_junbiao的博客!</B><br> <I>您好,欢迎访问 pan_junbiao的博客!</I><br> <U>您好,欢迎访问 pan_junbiao的博客!</U><br> <SUB>您好,欢迎访问 pan_junbiao的博客!</SUB>博客地址:https://blog.csdn.net/pan_junbiao<br> <SUP>您好,欢迎访问 pan_junbiao的博客!</SUP>博客地址:https://blog.csdn.net/pan_junbiao<br> </body> </html>
执行结果:
2.5 居中标记
HTML页面中的内容有一定的布局方式,默认的布局方式是从左到右依次排序。如果要想让页面中的内容在页面的居中位置显示,可以使用HTML中的<center>标记。<center>居中标记以<center>标记开头,以</center>标记结尾。标记之中的内容为居中显示。HTML5 不支持 <center> 标签。请用 CSS 代替。
2.6 文字列表标记
HTML语言中提供了文字列表标记,文字列表标记可以将文字以列表的形式依次排列。通过这种形式可以更加的方便网页的访问者。HTML中的列表标记主要有无序的列表和有序的列表两种。
2.6.1 无序列表
无序列表是在每个列表项的前面添加一个圆点符号。通过符号<ul>可以创建一组无序列表,其中每个列表项以<li>表示。
示例:使用无序列表对页面中的文字进行排序。
<html> <head> <title>无序列表标记</title> </head> <body> 编程词典有以下几个品种 <p> <ul> <li>Java编程词典</li> <li>VB编程词典</li> <li>VC编程词典</li> <li>.net编程词典</li> <li>C#编程词典</li> </ul> </body> </html>
执行结果:
2.6.2 有序列表
有序列表和无序列表的区别是,使用有序列表标记可以将列表项进行排号。有序列表的标记为<ol>,每一个列表项前使用<li>。有序列表中项目项是有一定的顺序的。
示例:使用有序列表对页面中的文字进行排序。
<html> <head> <title>有序列表标记</title> </head> <body> 编程词典有以下几个品种 <p> <ol> <li>Java编程词典</li> <li>VB编程词典</li> <li>VC编程词典</li> <li>.net编程词典</li> <li>C#编程词典</li> </ol> </body> </html>
执行结果:
2.7 表格标记
表格是网页中十分重要的组成元素。表格用来存储数据,包含标题、表头、行和单元格。在HTML语言中,表格标记使用符号<table>表示。定义表格光使用<table>是不够的,还需要定义表格中的行、列、标题等内容。
标记 说明 表格标记<table> <table></table>标记表示整个表格。<table>标记中有很多属性,例如 width 属性用来设置表格的宽度,border 属性用来设置表格的边框,align 属性用来设置表格的对其方式,bgcolor 属性用来设置表格的背景色等。 标题标记<caption> 标题标记以<caption>开头,以</caption>结束,标题标记也有一些属性,例如:align、valign 等。 表格行标记<tr> 一组<tr>标记表示表格中的一行。<tr>标记要嵌套在<table>标记中使用,该标记也具有 algin、background 等属性。 表头标记<th> 表头标记以<th>开头,以</th>结束,也可以通过 algin、background、colspan、valign 等属性来设置表头。 单元格标记<td> 单元格标记<td>又称为列标记,一个<tr>标记中可以嵌套若干个<td>标记。该标记也具有 algin、background、valign 等属性。 2.7.1 显示表格边框
方法一:在<table>标记中添加属性:border="1" cellspacing="0",如下:
<table border="1" cellspacing="0"> </table>
说明:
border="1"表示设置表格边框1px;
cellspacing="0"表示设置表格边框间距为0,即无边距。
方法二:使用CSS样式。
table { border-collapse: collapse;} table,table tr th, table tr td { border:1px solid #000000; }
2.7.2 单元格合并
colspan 是列合并,rowspan是行合并。
示例:在页面中定义学生成绩表,并在表格中显示边框,同时使用单元格合并。
<html> <head> <title>表格标记</title> <style> table { border-collapse: collapse;} table,table tr th, table tr td { border:1px solid #000000; } </style> </head> <body> <table align="center"> <caption>学生考试成绩单</caption> <tr> <th align="center" valign="middle">姓名</th> <th align="center" valign="middle">语文</th> <th align="center" valign="middle">数学</th> <th align="center" valign="middle">英语</th> </tr> <tr> <td align="center" valign="middle">张三</td> <td align="center" valign="middle">89</td> <td align="center" valign="middle">92</td> <td align="center" valign="middle">87</td> </tr> <tr> <td align="center" valign="middle">李四</td> <td align="center" valign="middle">93</td> <td align="center" valign="middle">86</td> <td align="center" valign="middle">80</td> </tr> <tr> <td align="center" valign="middle">王五</td> <td align="center" valign="middle">85</td> <td align="center" valign="middle">86</td> <td align="center" valign="middle">90</td> </tr> <tr> <th rowspan="2" align="center" valign="middle">博客信息</th> <td colspan="3" align="center" valign="middle">您好,欢迎访问 pan_junbiao的博客</td> </tr> <tr> <td colspan="3" align="center" valign="middle">博客地址:https://blog.csdn.net/pan_junbiao</td> </tr> </table> </body>
执行结果:
2.8 <hr>标记
<hr>(水平线)标记用于在页面上绘制水平线。
<hr>标签属性:
属性 说明 align 指定水平线的位置。 width 指定水平线的长度。 size 指定水平线的宽度,以像素为单位。 noshade 指定水平线以纯色而不是以阴影进行显示。 示例:在页面中显示水平线。
<hr noshade size="5" align="center" width="50%"/> <hr size="15" align="left" width="80%"/>
2.9 在HTML中使用特殊符字符
字符实体由3部分组成:&号、 实体名称和分号(;)。
如:空格: 版权号: ©
3、HTML表单标记
对于经常上网的人来说,对网站中的登录页面肯定不会感到陌生。在登录页面中,网站会提供给用户用户名文本框与密码文本框,以供访客输入信息。这里的用户名文本框与密码文本框就属于HTML中的表单元素。表单在HTML页面中起着非常重要的作用,是用户与网页交互信息的重要手段。
3.1 <form>表单标记
表单标记以<form>标记开头,以</form>标记结尾。在表单标记中可以定义处理表单数据程序的URL地址等信息。
<form>标记的语法:
<form action="url" method="get | post" name="formName" οnsubmit="" target=""> </form>
<form>标记的属性:
属性 说明 action 该属性用来指定处理表单数据程序的URL地址。 method 该属性用来指定数据传送到服务器的方式。它有两种属性值,分别为 get 和 post。get 属性值表示将输入的数据追加在 action 指定的地址后面,并传送到服务器。当属性值为 post 时,会将输入的数据按照 HTTP 协议中的 post 传输方式传送到服务器。 name 该属性指定表单的名称,程序员可以自定义其值。 onsubmit 该属性用于指定当前用户单击提交按钮时触发的事件。 target 该属性指定输入数据结果显示在哪个窗口中,其属性值可以设置为_blank、_self、_parent 和 _top。其中,_blank 表示在新窗口中打开目标文件;_self 表示在同一个窗口中打开,该项一般不用设置;_parent 表示在上一级窗口中打开,一般使用框架页时经常使用;_top 表示在浏览器的整个窗口中打开,忽略任何框架。 示例:创建表单,设置表单名称为 myForm,传送方式为 post,当用户提交表单时,提交至 action.html 页面进行处理。
<form id="form1" name="myForm" method="post" action="action.html" target="_blank"> </form>
<form>表单标记的详细使用,请浏览本博客的文章:HTML中Form表单的使用
3.2 <input>表单输入标记
表单输入标记是使用最频繁的表单标记,通过这个标记可以在向页面中添加单行文本、多行文本、按钮等。
<input>标记的语法:
<input type="image" disabled="disabled" checked="checked" width="digit" height="digit" maxlength="digit" readonly="readonly" size="digit" src="uri" usemap="uri" alt="" name="" value="" />
<input>标记的属性:
属性 描述 type 用于指定添加的是哪种类型的输入字段,共有10个可选值。 disabled 用于指定输入字段不可用,即字体变成灰色。其属性值可以为空值,也可以指定为 disabled。 checked 用于指定输入字段是否处于被选中状态,用于 type 属性值为 radio 和 checkbox 的情况下。其属性值可以为空值,也可以指定为 checked。 width 用于指定输入字段的宽度,用于 type 属性值为 image 的情况下。 height 用于指定输入字段的高度,用于 type 属性值为 image 的情况下。 maxlength 用于指定输入字段可输入文字的个数,用于 type 属性值为 text 和 password 的情况下,默认没有字数限制。 readonly 用于指定输入字段是否为只读。其属性值可以为空值,也可以指定为 readonly。 size 用于指定输入字段的宽度,当 type 属性为 text 和 password 时,以文字个数为单位,当 type 属性为其他值时,以像素为单位。 src 用于指定图片的来源,只有当 type 属性值 image 时有效。 usemap 为图片设置热点地图,只有当 type 属性值 image 时有效。属性值为 URI,URI格式为“#+<map>标记的 name 属性值”。例如,<map>标记的 name 属性为 Map,该URI为 #Map。 alt 用于指定当图片无法显示时显示的文字,只有当 type 属性值 image 时有效。 name 用于指定输入字段的名称。 value 用于指定输入字段默认的数据值,当 type 属性为 checkbox 和 radio 时,不可省略此属性;为其他值时,可以省略。当 type 属性为 button、reset 和 submit 时,指定的是按钮上的显示文字; 当 type 属性为 checkbox 和 radio 时,指定的是数据项选定的值。
type属性是<input>标记中非常重要的内容,决定了输入数据的类型。
type属性的属性值:
可选值 描述 可选值 描述 text 文本框 submit 提交按钮 password 密码域 reset 重置按钮 file 文件域 button 普通按钮 radio 单选按钮 hidden 隐藏域 checkbox 复选框 image 图像域 示例:在HTML页面中使用各种表单标记。
<html> <head> <title>表单标记</title> <style> .txtBox{ padding: 3px; width: 300px; font-size: 16px; } </style> </head> <body> <form action="" method="post" name="myform"> <table align="center"> <caption>用户注册</caption> <tr> <th>博客信息:</th> <td> <input class="txtBox" type="text" id="txtBlogInfo" name="blogInfo" value="您好,欢迎访问 pan_junbiao的博客!" /> </td> </tr> <tr> <th>博客地址:</th> <td> <input class="txtBox" type="text" id="txtBlogUrl" name="blogUrl" value="https://blog.csdn.net/pan_junbiao"/> </td> </tr> <tr> <th>性别:</th> <td> <input id="male" name="sex" type="radio" value="1" checked="checked"/> <label for="male">男</label> <input id="female" name="sex" type="radio" value="2"/> <label for="female">女</label> <input id="secrecy" name="sex" type="radio" value="3"/> <label for="secrecy">保密</label> </td> </tr> <tr> <th>兴趣爱好:</th> <td> <input id="lq" name="hobby" type="checkbox" value="篮球" checked="checked"> <label for="lq">篮球</label> <input id="zq" name="hobby" type="checkbox" value="足球" checked="checked"> <label for="zq">足球</label> <input id="ymq" name="hobby" type="checkbox" value="羽毛球"> <label for="ymq">羽毛球</label> <input id="ppq" name="hobby" type="checkbox" value="乒乓球"> <label for="ppq">乒乓球</label> <input id="yy" name="hobby" type="checkbox" value="游泳"> <label for="yy">游泳</label> </td> </tr> <!-- 以下是提交、取消按钮 --> <tr> <td colspan="2" style="text-align: center;"> <input type="submit" value="提交"/> <input type="reset" value="重置" /> </td> </tr> </table> </form> </body> </html>
执行结果:
3.3 <select>下拉列表标记
<select>标记可以在页面中创建下拉列表框,此时的下拉列表框是一个空的列表,要使用<option>标记向列表中添加内容。
<select>标记的语法:
<select name="name" size="digit" multiple="multiple" disabled="disabled"> <option value="" selected>选择项1</option> <option value="">选择项2</option> <option value="">选择项3</option> </select>
<select>标记的属性:
属性 描述 name 用于指定列表框的名称。 size 用于指定列表框中显示选项的数量,超出该数量的选项可以通过滚动条查看。 disabled 用于指定当前列表框不可使用(变成灰色)。 multiple 用于让多行列表框支持多选。 示例:在页面中应用<select>标记和<option>标记添加下拉列表框和多行下拉列表框。
<html> <head> <title>下拉列表标记</title> </head> <body> 下拉列表框: <select name="select1"> <option>pan_junbiao的博客</option> <option>KevinPan</option> <option>吖标</option> </select> 多行列表框(不可多选): <select name="select2" size="2"> <option>pan_junbiao的博客</option> <option>KevinPan</option> <option>吖标</option> </select> 多行列表框(可多选): <select name="select2" size="3" multiple> <option>pan_junbiao的博客</option> <option>KevinPan</option> <option>吖标</option> </select> </body> </html>
执行结果:
3.4 <textarea>多行文本标记
<textarea>为多行文本标记,与单行文本相比,多行文本可输入更多的内容。
<textarea>标记的语法:
<textarea cols="digit" rows="digit" name="name" disabled="disabled" readonly="readonly" wrap="value"> 文本内容 </textarea>
<select>标记的属性:
属性 描述 cols 用于指定多行文本框显示的列数(宽度)。 rows 用于指定多行文本框显示的行数(高度)。 name 用于指定多行文本框的名称,当表单提交后,在服务器端获取表单数据时应用。 disabled 用于指定多行文本框不可使用(变成灰色)。 readonly 用于指定多行文本框为只读。 wrap 用于设置多行文本框中的文字是否自动换行。 wrap属性的可选值:
可选值 描述 hard 默认值,表示自动换行,如果文字超过 cols 属性所指的列数就自动换行,并且提交到服务器时换行符同时被提交。 soft 表示自动换行,如果文字超过 cols 属性所指的列数就自动换行,但提交到服务器时换行符不被提交。 off 表示不自动换行,如果想让文字换行,只能按下 Enter 键强制换行。 示例:使用多行文本框,显示文字信息。
<html> <head> <title>多行文本框</title> </head> <body> <textarea name="content" cols="50" rows="5" wrap="hard"> 您好,欢迎访问 pan_junbiao的博客! 博客地址:https://blog.csdn.net/pan_junbiao 岁月从来不曾静好,只是有人在替你背负枷锁,含泪前行。也许是父母,也许是朋友,也许是陌生人,无论是谁,请记得常怀感恩之心。 </textarea> </body> </html>
执行结果:
4、超链接与图片标记HTML 语言的标记有很多,本文只介绍一些常用标记。除了上面介绍的常用标记外,还有两个标记需要介绍,即超链接标记和图标标记。
4.1 超链接标记
超链接标记是页面中非常重要的元素,在网站中实现从一个页面跳转到另一个页面,这个功能就是通过超链接标记<a>来完成。
<a>标记的语法:
<a href="uri" title="提示文字"></a>
<a>标记的属性:
属性 描述 href 用来设置链接到哪个页面中。 title 用来设置光标聚焦时显示的提示文字。 <a>标记不显示下划线(只有当光标聚焦时才显示下划线)
a { text-decoration: none; color: #454545; vertical-align: baseline; cursor: pointer; } a:hover { text-decoration: underline; color: #000; }
4.2 图标标记
在浏览网站中通常会看到各式各样的漂亮的图片,在页面中添加的图片是通过<img>标记来实现的。
<img>标记的语法:
<img src="uri" width="value" height="value" border="value" alt="提示文字">
<img>标记的属性:
属性 描述 src 用于指定图片的来源。 width 用于指定图片的宽度。 height 用于指定图片的高度。 border 用于指定图片外边框的宽度,默认值为0。 alt 用于指定当图片无法显示时显示的文字。 示例:在页面中添加图片与超链接。
<html> <head> <title>图片与超链接</title> </head> <body> <img src="images/logo.png" alt="pan_junbiao的博客" /><br> <a href="https://blog.csdn.net/pan_junbiao" title="pan_junbiao的博客">您好,欢迎访问 pan_junbiao的博客!</a> </body> </html>
执行结果:
-
peml:程序练习标记语言解析器,作为Ruby gem
2021-03-14 10:28:51PEML:程序练习标记语言 该存储库包含“ peml” ruby gem ,它是PEML的解析器。 编程练习标记语言(PEML) (欢迎提供名称选择的反馈!)旨在成为一种简单易用的格式,供各种CS和IT指导人员(学院,社区学院,... -
HTML的基本标记有哪些?简述它们各自的功能
2021-06-09 07:53:31满意答案lijingf2019.05.24采纳率:40%等级:9已帮助:167人HTML(HyperText Mark-up Language,超文本标记语言或超文本链接标示语言),是目前网络上应用最为广泛的语言,也是构成网页文档的主要语言。HTML文本是由...满意答案
lijingf
2019.05.24
采纳率:40% 等级:9
已帮助:167人
HTML(HyperText Mark-up Language,超文本标记语言或超文本链接标示语言),是目前网络上应用最为广泛的语言,也是构成网页文档的主要语言。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字、图形、动画、声音、表格、链接等。HTML的结构包括头部(Head)、主体(Body)两大部分,其中头部描述浏览器所需的信息,而主体则包含所要说明的具体内容。
HTML文档基本结构
在HTML网页文档的基本结构中主要包含以下几种标记。
1.HTML文件标记
和标记放在网页文档的最外层,表示这对标记间的内容是HTML文档。放在文件开头,放在文件结尾,在这两个标记中间嵌套其他标记。
2.HEAD文件头部标记
文件头用
和标记,该标记出现在文件的起始部分。标记内的内容不在浏览器中显示,主要用来说明文件的有关信息,如文件标题、作者、编写时间、搜索引擎可用的关键词等。在HEAD标记内最常用的标记是网页主题标记,即TITLE标记,它的格式为:
网页标题网页标题是提示网页内容和功能的文字,它将出现在浏览器的标题栏中。一个网页只能有一个标题,并且只能出现在文件的头部。
3.BODY文件主体标记
文件主体用
和标记,它是HTML文档的主体部分。网页正文中的所有内容包括文字、表格、图像、声音和动画等都包含在这对标记对之间。通常的标记样式如下:leftmargin="value" topmargin="value">….
00分享举报
-
html代码中常见的单标记有
2021-06-11 06:46:53html定义表单星号标记怎么做需要准备的材料分别有:电脑、浏览器、html编辑器。首先,打开html编辑器,新建html文件,例如:index.html,编写问题基础代码。在index.html中的标签前面,输入html代码:* 。浏览器运行...分别是哪些,双标签,分别是哪些,
在HTML基础中,单标签就是由一个标签组成的。例如、、、、、、。
html中有哪些单标签和双标签?
html定义表单星号标记怎么做
需要准备的材料分别有:电脑、浏览器、html编辑器。
首先,打开html编辑器,新建html文件,例如:index.html,编写问题基础代码。
在index.html中的标签前面,输入html代码:* 。
浏览器运行index.html页面。
html中的单标记有什么?
单标记,就是单一型,有两个类型: 无属性值。,如:。 有属性值。,如:。 在xhtml中,规定,所有HTML标记,都要小写,所有的标记都要有关闭。
html中p标记是单标记还是双标记指令?
我的书上有把p作为单标记指令强制换段 文字
来使用。 还有单独的
html中的 单标记和双标记怎么区分啊
强记。不过,现在web2.0大行其道,所以单标记写法不合web2.0规范了。
html中表单的定义标记中三个常用的属性
通俗的讲 form标签是用来进行表单提交用的 form标签里面的常见属性如下 action: 表单提交的地址, 肯定是要提交给某个服务器的,action的地址就是要提交的服务器的地址 method:以何种方式提交,常见的为get和post. 区别在于一个是明文(在url中显示)
在html中如何区分双标记与单标记?
我初学html 有些标记既有初始标记,又有结束标记 有些标记没有结束标记 不需要强记的. HTML标记中单标记的不算多. 而且有些有两种写法的. 想记住的话,记得几个单标记的就行. 其实常用的标记很少的. 就十几个而已.
HTML 中表格标记和单元格标记分别是什么
HTML里表格的标签是什么? 和 单元格的标签是什么? 表格的宽度可以用百分比和哪两种单位来设置? 答:另一种用实际尺寸单位,常用像素PX表示 用来输入密码的表单域是什么? HTML 网页文件的标记是什么? 文件的开始标记和文件
-
doconce:轻量级标记语言-一次记录,可在任何地方包含
2021-04-27 15:15:56DocOnce是一种标记适中(类似于Markdown的标记)的标记语言,主要针对科学报告,软件文档,书籍,博客文章以及幻灯片中涉及大量数学和代码的幻灯片。 从DocOnce来源,您可以生成LaTeX,Sphinx,HTML,IPython笔记本... -
HTML5:超文本标记语言1
2020-10-30 08:19:35本章内容 1.互联网技术概念入门 2.HTML5常见基础标签 3.超链接和多媒体标签 4.列表标签 5.表格标签 -
一些常用的HTML语言标记简介
2020-07-27 18:13:16HTML称为超文本标记语言,是一种标识性的语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字... -
HTML标记语言--常用标记
2016-05-31 20:05:46HTML标记语言标记符号 html:整个页面 head:页面首部 title:页面标题 body:页面正文 p:段落 h1-6:标题1号到6号 hr:水平线 a:锚点 百度网址无序列表:unordered list ul:无序列表 li:列表项目 ... -
XML(可扩展标记语言)
2019-03-31 01:19:43XML(可扩展标记语言)是一个标记语言定义了一系列的规则对于编码文件以一种机器和人类都可读的方式。W3C的XML 1.0规范和其他几个相关规范(都是免费开放标准)定义了XML. XML的设计目标强度简洁,普遍,互联网可用。... -
【单选题】用HTML标记语言编写一个简单的网页,网页最基本的结构是 A. html〉 〈head〉…〈/head〉 〈frame...
2021-06-08 17:35:10【单选题】用HTML标记语言编写一个简单的网页,网页最基本的结构是A. html〉 〈head〉…〈/head〉 〈frame〉…〈/frame〉 〈/html〉 B. 〈html〉 〈title〉更多相关问题[多选] 数控加工中心适宜于加工()的零件。[多选... -
超文本标记语言(英语:HyperText Markup Language,简称:HTML)
2018-09-19 08:42:10超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。您可以使用 HTML 来建立自己的 WEB 站点,HTML 运行在浏览器上,由浏览器来解析相对于整个网页,大模块 左边距离... -
html入门教程 html标记符号快速掌握
2021-01-19 21:22:34概要 HTML俗称超文本标记语言,是Hyper TextMarkup Language的缩写,是用于描述网页文档的一种标记语言。网页文件本身只是一种文本文件,我们通过在文本文件中添加标记符号,可以告诉浏览器如何显示其中的内容(如:... -
HTML&CSS超文本标记语言编程
2018-06-01 08:42:38超文本标记语言,标准通用标记语言下的一个应用。“超文本”就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。超文本标记语言的结构包括“头”部分(英语:Head)、和“主体”部分(英语:Body),其中... -
html标记是什么
2021-06-10 01:15:25html标记包含标签及其属性、基于字符的数据类型、...html是一种用于创建网页的标准标记语言;...超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。HTML是一种基础技术,... -
程序嵌入到HTML(标准通用标记语言下一个应用)文档中去执行,执行效率比完全生成HTML标记的CGI要高很多;...
2021-03-22 22:16:15语法吸收了C语言,Java和Perl的...程序嵌入到HTML(标准通用标记语言下一个应用)文档中去执行,执行效率比完全生成HTML标记的CGI要高很多; PHP还可以执行编译后代码,编译可以达到加密和优化代码运行,使代码运行重新 -
html(超文本标记语言)标签及案例总结
2018-08-08 14:57:37html(超文本标记语言)标签及案例总结 一、标签 1.文件标签 <html> <head> <title></title> <meta> <link> &... -
标记语言 编程语言 脚本语言分别有哪些? 区别是什么?
2021-11-08 00:02:17标记语言 标记语言,是一种将文本(Text)以及文本相关的其他信息结合起来,展现出关于文档结构和数据处理细节的电脑文字编码。与文本相关的其他信息(包括例如文本的结构和表示信息等)与原来的文本结合在一起,... -
超文本标记语言
2012-11-21 16:18:48超文本标记语言 百科名片 超文本标记语言,即HTML(Hypertext Markup Language),是用于描述网页文档的一种标记语言。 查看精彩图册 目录 基本介绍 由来 定义 语言特点 ... -
国内外话语标记语研究现状及趋势
2020-06-20 05:57:41话语标记语是依存于前言后语、划分说话单位的界标,是会话及写作中常见的语言现象,也是交际中具有一定语用功能的词语或结构,已成为国内外会话分析和语用研究中一个重要的探讨课题。简述话语标记语的兴起,通过介绍国外... -
可扩展标记语言
2017-10-31 21:37:43XML定义了一套元句法,与特定领域有关的标记语言(例如,MusicML、MathML和CML等)都必须遵守 XML模式 XML模式使用XML语法 XML模式支持数据类型 XML模式是可扩展的 XML模式有更强的表达能力 ... -
HTML中的那些常用标记
2021-06-14 07:10:421.HTMLHTML:(HyperText Markup Language)超级 文本 标记 语言用来描述网页的一种标记语言。2.基础学习网页的构成:※文本内容(text content):在页面上让访问者了解页面内容的纯文字。※对其他文件的引用(reference... -
Markdown标记语言语法及使用实例
2016-12-08 21:30:12Markdown 是一种用来写作的轻量级「标记语言」,它用简洁的语法代替排版,而不像一般我们用的字处理软件 Word 或 Pages 有大量的排版、字体设置。它使我们专心于码字,用「标记」语法,来代替常见的排版格式。例如此... -
R语言标记显著性标记
2020-12-21 16:50:02学术论文和杂志中最常见的是用“字母”和“星号”标记差异显著性,在之前的文章《显著性分析后如何标记“abc”?》已经介绍过如何用SPSS比较均值的结果进行“纯手动”添加字母显著性标记。嗯,方法似乎非常“绕”,... -