一.HTML的属性

1.1基本属性

1.1.1三个基本属性

class    　　　　定义类规则或者样式规则

id 　　　　　　  定义元素的唯一标识

stype　　　　　定义元素的样式声明

1.1.2不含三个基本属性的元素

html、head 　　 文档和头部信息基本结构

title　　　　　　网页标题

base　　　　　  网页的基准信息

meta　　　　　 网页元信息

param　　　　  元素参数信息

stype、script　  网页的脚本信息和样式

1.2语言属性

1.2.1两个属性

lang 　　　　　定义元素的语言代码或者编码

dir　　　　　　定义文本的方向

1.2.2不含语言属性的元素

iframe、frameset、frame　　　　　　网页框架架构

br　　　　　　　　　　　　　　　　 换行标识

hr　　　　　　　　　　　　　　　　 结构装饰线

base　　　　　　　　　　　　　　　网页基准信息

param　　　　　　　　　　　　　　 元素参数信息

script　　　　　　　　　　　　　　   网页的脚本

列子：

<html dir="rtl" xml:lang="zh-CN">

    <head>

        <meta http-equiv="content-type" content="text/html" charset="UTF-8"/>

        <title>标题在head标签中</title>

    </head>

    <body id="myid" lang="zh-CN">

        <h1>大标题</h1>

        <p><big>真香！！！</big></p>

        <p>真香</p>

    </body>

</html>

效果：

1.3键盘属性

accesskey　　　　　　定义访问某一个元素的快捷键

tabindex　　　　　　　定义tab键的索引编号

列子：

<html>

    <head>

        <meta http-equiv="content-type" content="text/html" charset="UTF-8"/>

        <title>tab键测试</title>

    </head>

        <from id="from1" name="from1" method="post" action="">

            <!--放在表格里-->

            <p><a  tabindex="1">输入你的账号<input type="text" name="text1" id="text1"/></a></p>

            <p>输入你的密码<input type="password" name="password1" id="password1"/></p>

            <p><a tabindex="2">你是一个有梦想的人吗？ 是的<input name="checkbox1" type="checkbox"  id="checkbox1" value="1"/></a>

                <a tabindex="3">怎么会不是呢？<input name="checkbox2" type="checkbox" id="checkbox2" value="2"/></a>

            </p>

            <p>你是小天才吗？

                <input name="button1" type="radio" value="1"/>不是

                <input name="button1" type="radio" value="1"/>第二个不是

            </p>

        </from>

</html>

效果：

现在他的tab键的索引是按照你定义的顺序来进行的

1.4内容属性

1.4.1五个内容属性

alt   　　　　　　定义元素的替换文本

title　　　　　　 定义元素的提示文本

longdese　　　   定义元素包含的内容的大段描述信息

cite 　　　　　　 定义元素引用的信息

datetime　　　　 定义元素包含内容的时间

列子：

<html>

    <head>

        <meta http-equiv="content-type" content="text/html" charset="UTF-8"/>

        <title>内容属性</title>

    </head>

    <body>

        <p><a title="当你的鼠标移动到这个元素上面的时候就会出现一个提示文本">把鼠标移动到这里</a></p>

    </body>

</html>

效果：

1.4.2title属性不能运用的元素

html head title base basefont meta param script这几个属性不能使用title属性

小白学习前端---第二天 HTML的基本属性————1的更多相关文章

  1. 小白学习前端---第一天 了解HTML

    一.HTML的结构 1.1 html文档主要包含两个部分:头区域和实体区域. 1.2 html的三个主要标签:<html>.<head>.<body>.<ht ...

  2. 学习前端第二天之css层叠样式

    一.设置样式公式 选择器 {属性:值:} 二.font 设置四大操作 font-size:字体大小 (以像素为单位) font-weight:字体粗细 font-family:字体    ( 可直接跟 ...

  3. 小白学习django第二站-模版配置

    上一站说道app创建,接下来我们来配置app的url路由 首先需要到setting.py中添加book这个app, 再到django_test文件里的urls添加路由 include() : 这个函数 ...

  4. 学习前端第二天心得体会（初步了解HTML5的部分API以及画布Canvas）

    一.HTML5部分API 1.选择器querySelector和querySelectorAll 1.1.querySelector:返回文档中匹配指定的CSS选择器的第一元素.  document. ...

  5. 小白学习tornado第二站-tornado简单介绍

    tornado基本web应用结构 分为两大块类 Application对象(只会实例化一次) 路由表URl映射 (r'/', MainHandler) 关键词参数settings RequestHan ...

  6. 小白学习VUE第二课：环境搭建 VUE Node.js VSCode template模板

    环境搭建 VUE Node.js VSCode template模板: 首先安装node:http://www.runoob.com/nodejs/nodejs-install-setup.html ...

  7. 偏前端--之小白学习本地存储与cookie

    百度了很多都是讲的理论,什么小于4kb啊之类的,小白看了一脸懵逼复制到html中为什么没效果!!哈哈.我来写一个方便小白学习. 贴图带文字描述,让小白也运行起来,然后自己再去理解... 1. cook ...

  8. iOS开发如何学习前端(2)

    iOS开发如何学习前端(2) 上一篇成果如下. 实现的效果如下. 实现了一个横放的<ul>,也既iOS中的UITableView. 实现了当鼠标移动到列表中的某一个<li>,也 ...

  9. iOS开发如何学习前端(1)

    iOS开发如何学习前端(1) 我为何学前端?因为无聊. 概念 前端大概三大块. HTML CSS JavaScript 基本上每个概念在iOS中都有对应的.HTML请想象成只能拉Autolayout或 ...

随机推荐

  1. phpstorm 安装yaf代码提示文件

    安装yaf代码提示:https://www.jianshu.com/p/dc719ae74f97 4.下载代码提示文件 下载地址: https://github.com/xudianyang/yaf. ...

  2. yaf

    一.yaf使用自定义的类 Yaf的library和model的文件命名规则和调用:https://www.cnblogs.com/leedom/p/9396138.html 安装参考: https:/ ...

  3. C#方法过滤器

    方法过滤器 使用Emit和注解属性Attribute实现 使用方式 1. 自定义方法过滤器 可分别定义方法执行前过滤器, 方法执行结束过滤器, 方法异常过滤器 执行前过滤器继承 ExecutingFi ...

  4. TCP 基础知识

    参考 朱小厮-一文详解TCP 博客园-"三次握手,四次挥手"你真的懂吗? 博客园-深度解密HTTP通信细节

  5. GlitchBot

    问题 F: GlitchBot 时间限制: 1 Sec  内存限制: 128 MB 提交: 230  解决: 113 [提交] [状态] [命题人:admin] 题目描述 One of our del ...

  6. Cookie和Seesion

    会话跟踪技术 1 什么是会话跟踪技术 我们需要先了解一下什么是会话!可以把会话理解为客户端与服务器之间的一次会晤,在一次会晤中可能会包含多次请求和响应.例如你给10086打个电话,你就是客户端,而10 ...

  7. JAVA基础知识笔记

    1.类只能用Public修饰,不能使用protected.private修饰.也可以不加修饰符,称做友好类. 2.类的实体元素包含成员变量和方法的定义,成员变量分为实例变量和类变量(static修饰的 ...

  8. Unity3D外包(u3d外包)—就找北京动点软件（我们长年承接U3D外包、Maya、3DMax项目外包）

    一.关于动点: 北京动点飞扬软件,因致力于虚拟现实技术的开发而创立,在虚拟现实开发领域有着卓越的技术和领先的思想.   我们为用户专业定制的项目,细分了多种工作流程,软件独立自主研发,编程简化用户操作 ...

  9. Linux之vi/vim编辑器

    1.概述 所有的Unix like系统都会内建 vi 文本编辑器,其他的文本编辑器则不一定会存在,但是目前我们使用比较多的是 vim 编辑器. vim具有程序编辑的能力,可以主动地以字体颜色辨别语法的 ...

  10. android -------- 压缩图片文件工具类

    项目中常常遇到文件压缩问题,上传文件大小限制 今天简单的分享一点干货,文件压缩,图片压缩,压缩Bitmap 主要通过尺寸压缩和质量压缩,以达到清晰度最优 效果图 源码地址: https://githu ...