1HTML 不是一种编程语言,而是一种标记语言
2只有 <body>区域才会在浏览器中显示。
3<!DOCTYPE>声明有助于浏览器中正确显示网页。doctype 声明是不区分大小写的
4属性总是以名称/值对的形式出现,比如:name="value"。
属性值应该始终被包括在引号内。
5<!-- 这是一个注释 -->
6HTML 代码中的所有连续的空行(换行)也被显示为一个空格。
7使用 target 属性,你可以定义被链接的文档在何处显示。如果你将 target 属性设置为 "_blank", 链接将在新窗口打开。
例如:<a href="https://www.runoob.com/" target="_blank">访问菜鸟教程!</a>
8 <link> 标签定义了文档与外部资源之间的关系。<link> 标签通常用于链接到样式表
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

9 在<style> 元素中你也可以直接添加样式来渲染 HTML 文档,搞不清link和style的区别
10 <meta> 标签提供了元数据.元数据也不显示在页面上,但会被浏览器解析。

每30秒钟刷新当前页面:<meta http-equiv="refresh" content="">

11 <script>标签用于加载脚本文件,如: JavaScript。

12 HTML<title>元素不仅可以显示文本,也可以在左侧显示logo等图片。显示时,要将<link>标签放入<head>里。

<head>
<link rel="shortcut icon" href="图片url">
<title>这是一个带图片的标签</title>
</head>

13

  • CSS 可以通过以下方式添加到HTML中:

    • 内联样式- 在HTML元素中使用"style" 属性
    • 内部样式表 -在HTML文档头部 <head> 区域使用<style> 元素 来包含CSS
    • 外部引用 - 使用外部 CSS 文件

14 当特殊的样式需要应用到个别元素时,就可以使用内联样式

15 style和link的区别:

标签 描述 例子
<style> 定义文本样式 <h1 style="text-align:center;">居中对齐的标题</h1>
<link> 定义资源引用地址
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

16  对于大部分标签,以上两种方法均可,且修改父级标签,子级标签特性也会改变。但某些标签确无法通过修改父级标签来改变子级标签特性,如a标签,修改其颜色特性,必须直接修改 a 标签的特性才可

17 <img src="boat.gif" alt="Big Boat"> 若图片显示不出来,则显示alt的值

18

 <map name="planetmap">
<area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">
<area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">
<area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>

19

<table border="">
<tr> 行
<th>Header </th> 表头
<th>Header </th>
</tr>
<tr>
<td>row , cell </td> 单元格
<td>row , cell </td>
</tr>
<tr>
<td>row , cell </td>
<td>row , cell </td>
</tr>
</table>

20

21

<div> 元素是块级元素,它可用于组合其他 HTML 元素的容器。

<span> 元素是内联元素,可用作文本的容器

22 由于创建高级的布局非常耗时,使用模板是一个快速的选项。通过搜索引擎可以找到很多免费的网站模板(您可以使用这些预先构建好的网站布局,并优化它们)

23 HTML 表单用于收集不同类型的用户输入

多数情况下被用到的表单标签是输入标签(<input>)。输入类型是由类型属性(type)定义的。

<input type="text">   <input type="password">  <input type="radio"> <input type="checkbox">

<input type="submit"> :当用户单击确认按钮时,表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。

<form name="input" action="html_form_action.php" method="get">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>
点击确认按钮,那么输入数据会传送到 "html_form_action.php" 的页面

24 同一组的单选按钮,name 取值一定要一致

<form>
<p>你生活在哪个国家?</p>
<input type="radio" name="country" value="China" checked="checked">中国<br />
<input type="radio" name="country" value="the USA">美国
</form>

25 点击之后会将重置按钮所在的表单中填写的内容重新设置为默认值

26

<script> 标签用于定义客户端脚本,比如 JavaScript。

<script> 元素既可包含脚本语句,也可通过 src 属性指向外部脚本文件。

27 只有在浏览器不支持脚本或者禁用脚本时,才会显示 <noscript> 元素中的内容

<body>
<script>
document.write("Hello World!")
</script>
<noscript>抱歉,你的浏览器不支持 JavaScript!</noscript>
<p>不支持 JavaScript 的浏览器会使用 &lt;noscript&gt; 元素中定义的内容(文本)来替代。</p>
</body>

28

<script>
function myFunction()
{
document.getElementById("demo").innerHTML="Hello JavaScript!";
}
</script> <button type="button" onclick="myFunction()">点我</button>

29

如果希望正确地显示预留字符,我们必须在 HTML 源代码中使用字符实体

如需显示小于号,我们必须这样写:&lt; 或 < 或 <

30 辅助应用程序(helper application)是可由浏览器启动的程序。辅助应用程序也称为插件。辅助程序是使用 <object> 标签来加载的。

<body>
<object width="" height="" data="bookmark.swf"></object>
</body>
<body>
<object height="" width="" data="horse.mp3"></object>
<p>如果你无法听到该音频,那么可能你的电脑或浏览器不支持该文件格式。</p>
<p>或者你没有打开扬声器。</p>
</body>

31

html学习 菜鸟的更多相关文章

  1. Xshell学习--菜鸟篇

    http://www.cnblogs.com/perseverancevictory/p/4910145.html 1)关于Xshell 网上更多的资料里提到的SSH客户端是putty,因为简单.开源 ...

  2. 深度学习菜鸟的信仰地︱Supervessel超能云服务器、深度学习环境全配置

    并非广告~实在是太良心了,所以费时间给他们点赞一下~ SuperVessel云平台是IBM中国研究院和中国系统与技术中心基于POWER架构和OpenStack技术共同构建的, 支持开发者远程开发的免费 ...

  3. 【PE结构】由浅入深PE基础学习-菜鸟手动查询导出表、相对虚拟地址(RVA)与文件偏移地址转换(FOA)

    0 前言 此篇文章想写如何通过工具手查导出表.PE文件代码编程过程中的原理.文笔不是很好,内容也是查阅了很多的资料后整合出来的.希望借此加深对PE文件格式的理解,也希望可以对看雪论坛有所贡献.因为了解 ...

  4. Jquery 学习-菜鸟教程

    jquery效果和元素选择 //元素选择 $(this).hide(); $("p.test") //隐藏所有class="test"的<p>元素 ...

  5. 菜鸟教程之学习Shell script笔记(下)

    菜鸟教程Shell script学习笔记(下) 以下内容是学习菜鸟教程之shell教程,所整理的笔记 菜鸟教程之shell教程:http://www.runoob.com/linux/linux-sh ...

  6. 菜鸟教程之学习Shell script笔记(中)

    菜鸟教程Shell script学习笔记(中) 以下内容是学习菜鸟教程之shell教程,所整理的笔记 菜鸟教程之shell教程:http://www.runoob.com/linux/linux-sh ...

  7. 菜鸟教程之学习Shell script笔记(上)

    菜鸟教程之学习Shell script笔记 以下内容是,学习菜鸟shell教程整理的笔记 菜鸟教程之shell教程:http://www.runoob.com/linux/linux-shell.ht ...

  8. 菜鸟vimer成长记——目录

    菜鸟vimer成长记——第0章.我眼中的vim学习 菜鸟vimer成长记——第1章.统一概念 菜鸟vimer成长记——第2.0章.模式初探 菜鸟vimer成长记——第2.1章.normal模式 菜鸟v ...

  9. Java 8 Stream流编程学习

    本文是自己学习菜鸟教程中总结的笔记,用于快速找代码,完整的文档见菜鸟教程:Java 8 Stream Stream 使用一种类似用SQL语句从数据库查询数据的直观方式来提供一种对Java集合运算和表达 ...

随机推荐

  1. Properties类使用详解

    Java Properties类使用详解   概述 Properties 继承于 Hashtable.表示一个持久的属性集,属性列表以key-value的形式存在,key和value都是字符串. Pr ...

  2. LeetCode 404. 左叶子之和(Sum of Left Leaves)

    404. 左叶子之和 404. Sum of Left Leaves LeetCode404. Sum of Left Leaves 题目描述 计算给定二叉树的所有左叶子之和. 示例: 3 / \ 9 ...

  3. pytorch1.0神经网络保存、提取、加载

    pytorch1.0网络保存.提取.加载 import torch import torch.nn.functional as F # 包含激励函数 import matplotlib.pyplot ...

  4. 019 Android 形状可绘制对象(根据要求绘制图片)+图片选择器

    1.目标效果 绘制颜色渐变的图片 2.实现方法 (1)在app--->res--->drawable 右击drawable文件夹右键,new ---->drawable resour ...

  5. pip install 遇到的问题

    执行pip命令时遇到 Fatal error in launcher: Unable to create process using '"'   电脑同时安装了python-2.7.13跟p ...

  6. 从零开始学Flask框架-006

    重定向和用户会话 因为刷新页面时浏览器会重新发送之前已经发送过的最后一个请求.如果这个请求是一个包含表单数据的POST 请求,刷新页面后会再次提交表单. 基于这个原因,最好别让Web 程序把POST ...

  7. AVR单片机教程——烧写hex文件

    每一次build项目,编译器都会生成多个文件,其中有一个就是hex文件.之前在IDE中配置的external tools,就是把这个hex文件烧写到单片机中去的. 然而,有些时候你想运行别人的程序,但 ...

  8. RT1502移植LUA成功的总结

    1.由于LUA需要至少50K的RAM(经验值),所以stack和heap设置的尽量大,当前分别都设置为了64K.在文件rt1052_flexspi_scf.scf里面改动: #define Stack ...

  9. Scala 面向对象编程之类

    定义一个简单的类 // 定义类,包含field以及方法 class HelloWorld { private var name = "leo" def sayHello() { p ...

  10. vs2017环境下python包的安装

    1)---vs已经下载了的才适用 1,鼠标放在右侧窗口python环境那里(如没有窗口,可点击最上方的“窗口”-“重置窗口”) 2,右键然后点击“查看所有python环境”,会弹出当前默认的环境(高亮 ...