html就是指一个html文件，它是由各种标签组成的

html分为 < !DOCTYPE html > 和 Head 和 Body

  1. Head title+meta+link+style
  2. Body 标签元素+script

标签元素在js里叫做节点dom-node，节点，标签，元素都是他的叫法

最常用的标签元素当然是 div

其次还有 a，p，span，img，table标签，表单标签，按钮button

  1. table标签有table，thead，tbody，tr，th，td
  2. 表单标签有form，input（输入框，密码框，单选，多选，下拉框，textarea，提交submit）

标签有属性和方法的触发条件

标签有特有的属性attr，每个属性有特定的功能，是html标签特有的

比如a标签和link的href，a标签还有一个target，script和img的src，表单标签的value，disabled，单选多选的checked，select的selected 等等等

标签还可以自定义属性，就是在标签里写什么属性都行，不影响标签的使用，常用来记录数据，比如this-id="",data-id="",aa="",bb=""....但是最能被理解的，不会被下一个维护者骂娘的肯定是data-xx=""

怎么取得自定义属性，或者自带属性的值在js里讲

标签还能赋予方法，比如给div的点击条件绑定方法

<div onclick="say()">点击我执行js的say方法</div>

还可以直接写行内方法

<div onclick="alert(1111)">点击我执行alert方法</div>

这个触发条件是标签自带的，给没有这个触发条件的标签添加方法是不会执行的，比如单选，多选，下拉框，文件选择框有onchange触发条件，form有submit触发条件，输入框有光标移入移出键盘按下触发条件，但是div没有，所以给一个div添加onchange去执行say的时候，say是怎么都不会执行的

标签元素分为块级元素，行内元素

  1. 块级元素就是宽度自动就是占满父元素的，而高度是由子元素撑开的，可以通过css改变宽高，跟另一个元素一起会把自己占一行，把自己换行，把下一个挤换行，天生的块级元素有div，p，以及html5的语义化标签
  2. 行内元素就是一行可以有多个元素的，他们的宽和高都是由子元素撑开的，设置宽高是不生效的，天生的行内元素有span，button，表单标签，img

    而任何一个标签元素都是可以用css的display改变，只要记住他们的特点就行

讲讲标签的理解

  1. 讲讲a标签，a标签是用来跳转连接的，如果不是就别用；
  2. 讲讲img标签，img标签在足够大的区域里，会显示自身图片的原始大小，只把宽度设置为100%，会占满宽度的区域，高度由自身比例改变，也可以只设置高度，让宽度按图片比例改变，也可以同时设置宽度和高度，但是会导致图片变形，所以一般只设置宽度为100%，通过改变img的父标签的宽度控制img标签的宽度；
  3. 讲讲一些废弃的标签，font，color，time，这些标签别用，虽然很语义化但是别用，不解释；
  4. 讲讲form,form是很老的提交数据去到服务器的方式，现在除了提交文件根本用不到了，提交from的方式有【在子元素只有一个输入框时按下回车键，按下form标签里的submit标签或者button标签】，而且form提交会导致页面跳转，当然阻止form跳转的方式也是有的，阻止form提交会在js的上传文件的几种方式里讲，我想说的是除了文件上传之外别用到form，别用form，别用form；
  5. 谈谈input[type=submit]和button，这两个标签平时能当按钮使用，在form标签里触发提交事件，而且这两个标签自带样式，很丑的样式，还得手动去去除，所以能别用就别用，用span去代替他们的使用

html其实没什么好讲的，因为入门只有div

<!DOCTYPE html>

<html>

<head>

  <meta charset="utf-8">

  <title>第一个页面</title>

  <link rel="stylesheet" href="">

</head>

<body>

  <div>

    <p>Hello Word</p>

    <img src="" alt="">

  </div>

  <script type="text/javascript">

  </script>

</body>

</html>

html基础与入门的更多相关文章

  1. Linux基础知识入门

    [Linux基础]Linux基础知识入门及常见命令.   前言:最近刚安装了Linux系统, 所以学了一些最基本的操作, 在这里把自己总结的笔记记录在这里. 1,V8:192.168.40.10V1: ...

  2. cmd 与 bash 基础命令入门

    身为一个程序员会用命令行来进行一些简单的操作,不是显得很装逼嘛!?嘿嘿~ ヾ(>∀<) cmd 与 bash 基础命令入门       简介       CMD 基础命令          ...

  3. IM开发者的零基础通信技术入门(二)：通信交换技术的百年发展史(下)

    1.系列文章引言 1.1 适合谁来阅读? 本系列文章尽量使用最浅显易懂的文字.图片来组织内容,力求通信技术零基础的人群也能看懂.但个人建议,至少稍微了解过网络通信方面的知识后再看,会更有收获.如果您大 ...

  4. IM开发者的零基础通信技术入门(一)：通信交换技术的百年发展史(上)

    [来源申明]本文原文来自:微信公众号“鲜枣课堂”,官方网站:xzclass.com,原题为:<通信交换的百年沧桑(上)>,本文引用时已征得原作者同意.为了更好的内容呈现,即时通讯网在收录时 ...

  5. 序言 - PHP零基础快速入门

    我为什么要写<PHP零基础快速入门>? 原因: PHP 真心简单,适合零基础的人快速入门掌握,身边的人学习一两周上手开发的比比皆是: 市面上的文章或书籍对初学者并不友好,多半枯燥乏味,我相 ...

  6. Java基础语法入门01

    Java基础语法入门01 学习java你要先进行去了解JDK,JRE,JVM JDK Java开发工具包 JRE Java语言开发的运行环境 JVM Java虚拟机,用于Java语言的跨平台所用. 当 ...

  7. 贝叶斯公式由浅入深大讲解—AI基础算法入门

    1 贝叶斯方法 长久以来,人们对一件事情发生或不发生的概率,只有固定的0和1,即要么发生,要么不发生,从来不会去考虑某件事情发生的概率有多大,不发生的概率又是多大.而且概率虽然未知,但最起码是一个确定 ...

  8. Hadoop基础-MapReduce入门篇之编写简单的Wordcount测试代码

    Hadoop基础-MapReduce入门篇之编写简单的Wordcount测试代码 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 本文主要是记录一写我在学习MapReduce时的一些 ...

  9. 零基础快速入门web学习路线（含视频教程）

    下面小编专门为广大web学习爱好者汇总了一条完整的自学线路:零基础快速入门web学习路线(含视频教程)(绝对纯干货)适合初学者的最新WEB前端学习路线汇总! 在当下来说web前端开发工程师可谓是高福利 ...

  10. Python 零基础 快速入门 趣味教程 (咪博士 海龟绘图 turtle) 7. 条件循环

    条件循环能够让程序在条件成立时(即为真时)重复执行循环体中的语句.如果条件一直成立(即永远不会为假),则循环会一直进行下去,不会停止.如果初始时,条件不成立,则循环 1 次也不会执行.Python 中 ...

随机推荐

  1. python 中的生成器（generator）

    生成器不会吧结果保存在一个系列里,而是保存生成器的状态,在每次进行迭代时返回一个值,直到遇到StopTteration异常结束 1.生成器语法: 生成器表达式:通列表解析语法,只不过把列表解析的[] ...

  2. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 排版：设定单词首字母大写

    <!DOCTYPE html> <html> <head> <title>菜鸟教程(runoob.com)</title> <meta ...

  3. GIT使用教程——命令详解

    $ git init 当前目录建立GIT可以管理的仓库(版本库),生成一个.git的隐藏文件夹 $ git add <filename> 将工作区的文件修改添加到版本库的暂存区 $ git ...

  4. 【剑指Offer面试编程题】题目1361：翻转单词顺序--九度OJ

    题目描述: JOBDU最近来了一个新员工Fish,每天早晨总是会拿着一本英文杂志,写些句子在本子上.同事Cat对Fish写的内容颇感兴趣,有一天他向Fish借来翻看,但却读不懂它的意思.例如,&quo ...

  5. C语言程序编译

    原来GCC的含义是GNU C Compiler,当初知识编译C语言,而现在GCC不知编译C语言,除此之外它还支持编译Ada.C++.Java.Object C.Pascal.COBOL.等等许多语言, ...

  6. springboot下使用dubbo的简单demo

    1.一些话 现在java后端开发大多用springboot来简化环境搭建,现在一直使用的是springcloud和k8s有关的东西,以前用过dubbo,但那会儿的开发环境搭建流程较为繁琐,而且不支持r ...

  7. 2019暑期集训第二讲 - 组合数学&概率&数学期望

    A - 容斥原理(CodeForces - 451E) 二进制状态压缩暴力枚举哪几个花选的个数超过了总个数,卢卡斯定理求组合数,容斥原理求答案 可以先把每个花的数量当成无限个,这样就是一个多重集的组合 ...

  8. Mac安装navigate premium

    转自Navicat Premium for Mac v12.0.22.0 破解教程,macOS上手动破解,无需补丁,无毒今天换了电脑,想装一个Navicat,突然发现了这篇破解教程,竟爱不释手,顾Co ...

  9. node.js是什么，node.js创建应用

    简单的说 Node.js 就是运行在服务端的 JavaScript.Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台.Node.js是一个事件驱动I/O服务端Java ...

  10. RIFF

    RIFF全称为资源互换文件格式(Resources Interchange File Format),是Windows下大部分多媒体文件遵循的一种文件结构. RIFF文件所包含的数据类型由该文件的扩展 ...