自封闭的html标签

自封闭的html标签

  •  br 换行

语法:<br />

  •  Hr 分割线(horizontal rule)

语法:<hr />

属性值:

        align:对齐方式,用css实现

        noshade定义显示方式(不定义为原始颜色,定义了带凹槽的样式)用css实现

  size 定义水平线高度,用css实现

   width定义水平线的宽度,用css实现


  •  img 图像的标签

语法:<hr />

属性:

alt 代表图像的替代文字,SEO关键字


src 代表一个图片的源(图片的位置)


height 图像高度(其实浏览器会自动识别出图像的高度与宽度,一般不用我们指定,除非有其它的目的)


width 图像宽度     

  

title图片的提示的文字(当鼠标停留在图片上会显示)


拓展:网页设计中最常用的图片有三种gif,jpg,png,他们的共同点就是经过了压缩,压缩比越高,图像品质  越差。

Gif:最多支持256色支持透明,支持多帧动画显示效果(可以使用在品质较差或者需要透明或动画显示     的情况)

Jpeg支持多种颜色,可以有很高的压缩比,使用了有损压缩,不支持透明,不支持动画(可以使用在        品质要求较高的场合,比如风景,写真等)

Png 是一种新的图片技术,使用了无损压缩,支持透明,不支持动画

  • area 定义图像点击区域。

语法:<area />

注意:area标签必须使用在map标签中,而且必须配合img标签使用。

属性:

ccesskey定义了链接可以使用快捷键(alt+字母)

主菜单与导航菜单使用accesskey 通常是个不错的选择。

取值:字母。

例如

<ahref="http://www.dreamdu.com/xhtml/" accesskey="h">(按住Alt键)点击键盘上的h再按回车(IE)


alt图像提示的文字

coords 定义可点击区域的图形的坐标

href html链接源的url

nohref  图像点击排除的区域,当不使用href时应使用nohref

shape可点击区域的形状

tabindex使用tab键的遍历顺序

target 链接目标

  • base

说明:URL用于页面的链接与引用,base标签只能放置在head标签内,当使用相对路径定义链接时,可以使用base标签定义基URL解析所有文档中定义的相对路径的URL。

语法:<base />

属性

href --基URL。

target --链接目标。

l  Doctype

说明:定义了标准文档的类型,会使浏览器使用相应标准加载网页并显示

注意:文档类型定义在HTML文档的第一行,在html标签之前.

文档不定义DOCTYPE,浏览器将无法获知HTML或XHTML文档的类型,因此会进入混乱模式

l  link 当在文档中声明使用外接资源(比如CSS)时使用此标签

 

属性:

属性

href -- 指定需要加载的资源(CSS文件)的地址URI

media -- 媒体类型

rel --指定链接类型

rev --指定链接类型

title --指定元素名称

type -- 包含内容的类型,一般使用type="text/css"

例如:

<head>

    <linkrel="stylesheet"type="text/css"href="style.css"/>

</head>

l  meta

说明:此标签只能出现在head标签内

属性:(详细见博客)

content -- content属性

http-equiv -- http-equiv属性

id -- id属性

name -- name属性

scheme -- scheme属性:

 

l  frame

l  input

l  param

l  isindex

l  basefont


### HTML 标签语法规则 HTML标签是构建网页的基础组件,遵循特定的语法规则。每个标签通常由尖括号包围 `< >` ,并分为起始标签和结束标签,两者通过斜杠 `/` 进行分隔[^3]。 #### 基本结构示例 ```html <!DOCTYPE html> <html> <head> <title>页面标题</title> </head> <body> <!-- 页面主体内容 --> </body> </html> ``` 此代码展示了最简单的HTML文档框架。其中 `<!DOCTYPE html>` 是必需声明,用来告知浏览器当前文档遵循HTML5标准;`<html></html>` 定义整个HTML文档范围;`<head></head>` 包含有关文档的信息(元数据);最后 `<body></body>` 则封装实际显示给用户的可见部分。 #### 单独使用的自闭合标签实例 某些特殊情况下存在无需配对使用的单个标签形式——即所谓的“自封闭标签: ```html <!-- 图像展示 --> <img src="image.jpg" alt="描述图片"> <!-- 断行处理 --> <br> <!-- 输入框控件 --> <input type="text"> ``` 这些例子表明,并不是所有的元素都需要成对标记来表示其作用域边界。对于这类情况下的标签,在书写时同样推荐保持小写字母的习惯以确保一致性[^2]。 #### 属性设置方式举例 除了名称之外,很多标签还支持携带额外参数—属性,它们位于开标签内部并通过键值对的形式给出具体配置项: ```html <a href="https://example.com">访问链接</a> <p class="introductory-text" id="first-paragraph">这是一个段落。</p> <div style="color:red;">红色文本</div> ``` 上述片段分别演示了如何利用不同的属性定制超链接目标地址、CSS样式类名以及内联样式的应用方法[^1]。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值