一.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. ORA-55617解决方法

    昨天一测试环境出现异常ORA-55617: Flashback Archive "XXXXX" runs out of space and tracking on "XX ...

  2. opencv学习之路（28）、轮廓查找与绘制（七）——位置关系及轮廓匹配

    一.点与轮廓的距离及位置关系 #include "opencv2/opencv.hpp" #include <iostream> using namespace std ...

  3. JAVASCRIPT 分层概念

    1)底层(框架提供): 封装DOM和Event相关操作,提供跨浏览器兼容的接口,扩展原生javascript语言本身不提供的但又特实用的接口,例如namespace; 2)抽象类层(框架提供 统一自定 ...

  4. linux centos7添加ip黑名单禁止某个ip访问

    centos7用的是firewall 添加单个黑名单只需要把ip添加到 /etc/hosts.deny 格式  sshd:$IP:deny vim /etc/hosts.deny   添加你要禁止的i ...

  5. Convolutional Pose Machines

    Convolutional Pose Machines 2018-12-10 18:17:20 Paper:https://www.cv-foundation.org/openaccess/conte ...

  6. #python计算结果百位500向下取整，（0-499取000，500-999取500)

    !/usr/bin/env python coding:utf-8 计算结果百位500向下取整,(0-499取000,500-999取500) import math calc_Amount = fl ...

  7. Vs10.设置.高亮（20190327）

    ZC:(20190327)只要使用的是 "Highlight all occurrences of selected word" 和 "Visual Assist X&q ...

  8. 20175317 《Java程序设计》第三周学习总结

    20175317 <Java程序设计>第三周学习总结 教材学习内容总结 第三周我学习了教材第四章的内容,了解了Java中的部分常用语句,学到了以下内容: 明白了什么是类,成员变量有哪些,什 ...

  9. Spring boot actuator端点启用和暴露

    1.启用端点 默认情况下,除了shutdown端点是关闭的,其它的都是启用的.配置一个端点的启用,使用management.endpoint..enabled属性,下面的例子是启用shutdown端点 ...

  10. ThinkPHP5.0完全开发手册 --技术文档

    1.ThinkPHP5.0完全开发手册.chm 链接:https://pan.baidu.com/s/1199wK6q6O9IyOf5RU_-Xow 提取码:hnek 2.ThinkPHP5.0完全开 ...