Web前端速成(Html+Css+JavaScript+jQuery)-4.属性

乐地课堂

已于 2023-06-11 00:55:12 修改

阅读量86

点赞数

分类专栏：前端开发文章标签： html 前端 css javascript jquery

于 2023-05-02 11:03:31 首次发布

本文链接：https://blog.csdn.net/dhldhl/article/details/130462081

版权

前端开发专栏收录该内容

25 篇文章 1 订阅

订阅专栏

内容摘要：
- 对html标签属性的介绍和案例讲解。

4.属性

知识点：

属性可以在元素中添加附加信息
属性一般在开始标签描述
属性总是以名称/值对的形式出现，比如：id=“myName”
CSS设置标签属性的值可以实现标签的不同展示样式

全局属性	描述
class	为html元素定义一个或多个类名（classname）(类名从样式文件引入)
id	定义元素的唯一id
style	规定元素的行内样式（inline style）
title	描述了元素的额外信息 (作为工具条使用)
accesskey	设置访问元素的键盘快捷键
contenteditableNew	规定是否可编辑元素的内容
contextmenuNew	指定一个元素的上下文菜单。当用户右击该元素，出现上下文菜单
data-*	用于存储页面的自定义数据
dir	设置元素中内容的文本方向
draggable	指定某个元素是否可以拖动
dropzone	指定是否将数据复制，移动，或链接，或删除
hidden	hidden 属性规定对元素进行隐藏
lang	设置元素中内容的语言代码
spellcheck	检测元素是否拼写错误
tabindex	设置元素的 Tab 键控制次序
translate	指定是否一个元素的值在页面载入时是否需要翻译

运用例子：

备注：请亲自动手模仿着输入代码，在反复练习中熟悉。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>HTML 属性</title>
</head>
<body>
    href 属性指定链接的地址 <br>
    style 属性规定元素的行内样式 <br>
    <a href="https://www.baidu.com"  style="background-color: rgb(255, 0, 60);"> 这是一个链接 </a> 
    <br>
    src 属性指定图像的地址 <br>
    width属性指定图像的宽<br>
    height属性指定图像的高<br>
    id属性指定这元素在本页面的唯一 id<br>
    title属性描述了元素的额外信息<br>
    <img id="myPic" title="imgTitle" src="https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png" width="500" height="100" />     
</body>
</html>