MOOC web前端开发笔记（二）
HTML
HTML概述
HTML（HyperText MarkUp Language）
"超文本标记语言"，以标签的形式规定网页结构，它是制作网页的标准语言
HTML不区分大小写
标签、元素与属性
1.由尖括号包围，比如<pre><title></pre>
2.通常是成对出现的，也可以单独出现。
标签要有正确的嵌套，如：
<pre><html><bodt></body><html></pre>
标签加上标签里的内容就变成了元素。如：
<title>hello,world</title>就是一个元素。
被嵌套的元素称为嵌套元素的子元素，反之可以说是父元素，同级元素是兄弟元素，如：
\ 外层：父元素
\ 内层：子元素
\ 同级：兄弟元素
\ 内层：子元素
\
\
这些关系可以用一个树来表示，我们称为：HTML DOM树（Document Object Model）（文档对象模型）
标签中可以带有一些属性来描述这个标签，属性的顺序无关。
HTML的文件结构
第一行会有一个<!DOCTYPE html>表示文档类型符合html5标准
最外层有一堆html标签，表示文件的开始和结束，它的lang属性代表其是中文网页还是英文网页，提供给搜索引擎，内部第一个部分比较重要的一堆head标签，它表示的就是文件的头部信息，这是网页对浏览器和搜索引擎提供的信息。
内层标签body表示网页的主题内容，网页的主题内容会呈现在浏览器的主体部分。
\
\
\
\
\Document
\
\
\
\
HTML编辑器
记事本
Adobe DW
Sublime Text3
webstorm
html标签
html：代表文件的开始和结束，它的属性有lang，表示其为什么类型的网页。
meta：meta表示文件的元数据，具体可见博客HTML meta标签总结与属性使用介绍
注意，meta的字符集属性必须与文件的保存字符集属性相同。
h1~h6：标题标签，标题级数越大，字体大小越小，通常一个网页只有一个h1。
p：段落标签，每个段落自动换行，段落内部文字忽略连续空格（可以用 ），也不会显示空行，且不会换行
br：段内换行，记得加斜杠。
pre：预留格式标签，文本中的空格和换行符会被保留，适合显示计算机代码。
span：组合行内元素，以便通过CSS样式来格式化。
hr：水平线标签，添加水平线。
!-- --：注释标签。
a：超链接标签，用于链接其他网页，href属性用于说明链接网址，需要说明协议名字（如：http://），也可以使用虚拟超链接，用#表示。
img：插入图像标签，src属性：文件路径+文件名，表示图片的地址，alt属性表示图片无法显示时显示的文本。
div：区域标签，属性：id（CSS中用），align：对齐方式。
ul：无序列表
ol：有序列表
li：列表项
table：表格标签，属性border表示表格的宽度
tr：表示table row，即表格的行。
td：表示表格的列。
th：把表格元素加粗显示。
form：表单标签，action属性与后端相关。
input：文本输入框/按钮，type属性，代表文本框类型，如text，password。name属性供给后端，如果type为submit、reset、radio和checkbox会有value属性，checked属性规定该选项是否已被选择。对了一组单选框name属性一定要一致啊。
select：下拉列表框标签。
option：选项标签，selected属性表示默认的选项。
textarea：文本区标签,属性cols代表列，rows代表行。
相关博客
MOOC web前端开发笔记（二）的更多相关文章
- MOOC web前端开发笔记（一）
网站和网页 网站 互联网上用于展示特定内容的相关网页的集合. 网页 网站中的一页,一个网站中的网页通过"超链接"的方式被组织在一起. 主页 进入网站看到的第一个网页,主页的文件名通 ...
- web前端开发笔记（2）
一.什么是作用域. 所有变量都存在于一个执行环境中(也称作用域),这个执行环境决定了变量的生命周期,以及哪一部分代码可以访问其中的变量.总结: 执行环境有全局执行环境和函数执行环境. 每次进入一个新执 ...
- web前端开发笔记（1）
一.HTML标签书写有哪些规范? 页面编码. 文档声明. 关键字与描述. 行内元素不能包含块级元素. a标签不能嵌套a标签. 标签名和属性必须用小写字母书写,属性必须加引号,标签必须闭合,单标签页必 ...
- 《编写高质量代码－－Web前端开发修炼之道》读书笔记
前言 这两周参加公司的新项目,采用封闭式开发(项目成员在会议室里开发),晚上加班到很晚,所以没时间和精力写原创博客了,今天就分享下这篇<编写高质量代码--Web前端开发修炼之道>读书笔记吧 ...
- Web 前端开发精华文章推荐（jQuery、HTML5、CSS3）【系列十二】
2012年12月12日,[<Web 前端开发人员和设计师必读文章>系列十二]和大家见面了.梦想天空博客关注 前端开发 技术,分享各种增强网站用户体验的 jQuery 插件,展示前沿的 HT ...
- web前端开发最佳实践笔记
一.文章开篇 由于最近也比较忙,一方面是忙着公司的事情,另外一方面也是忙着看书和学习,所以没有时间来和大家一起分享知识,现在好了,终于回归博客园的大家庭了,今天我打算来分享一下关于<web前端开 ...
- Web 前端开发人员和设计师必读文章推荐【系列二十八】
<Web 前端开发精华文章推荐>2014年第7期(总第28期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各类能够提升网站用户体验的优秀 jQuery 插件,展示前沿的 HTML5 ...
- Web 前端开发人员和设计师必读精华文章【系列二十六】
<Web 前端开发精华文章推荐>2014年第5期(总第26期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各类能够提升网站用户体验的优秀 jQuery 插件,展示前沿的 HTML5 ...
- Web 前端开发精华文章推荐（HTML5、CSS3、jQuery）【系列二十三】
<Web 前端开发精华文章推荐>2014年第2期(总第23期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各类能够提升网站用户体验的优秀 jQuery 插件,展示前沿的 HTML5 ...
随机推荐
- delphi开第二个进程报错cannot create file editorlineends.ttr
网上说问题是windows系统补丁造成的,解决办法有卸补丁.装插件,还有自己搞个bat启动. 在网上看到最好的一个办法是: 把这个文件EditorLineEnds.ttr的后缀改为ttf,然后安装这个 ...
- OpenFOAM——具有压差的平行平板间流动（泊肃叶流动）
本算例翻译整理自:http://the-foam-house5.webnode.es/products/chapter-1-plane-parallel-plates-case/ 这个算例中两平板间没 ...
- EduSoho之插件开发(脚手架搭建)
本文主要参考官方文档,地址为:http://developer.edusoho.com/plugin/start.html 插件开发的目的,一方面为了更好的扩展,另外一方面为了更好的维护. 关于这方面 ...
- 第09组 Alpha冲刺（1/4）
队名:软工9组 组长博客: https://www.cnblogs.com/cmlei/ 作业博客: 组员进度 ● 组员一(组长) 陈明磊 ○过去两天完成了哪些任务 ●文字/口头描述 初步 ...
- Ubuntu18.04 Server安装Nginx+Git服务和独立的svn服务
安装Nginx+Git 需要安装的包有 nginx, fcgiwrap, git. 其中git在Ubuntu18.04 Server安装时已经默认安装了. 需要安装的是前两个 而fcgiwrap是在 ...
- 分类的性能评估：准确率、精确率、Recall召回率、F1、F2
import numpy as np import pandas as pd from sklearn.feature_extraction.text import TfidfVectorizer f ...
- （转载）PyTorch代码规范最佳实践和样式指南
A PyTorch Tools, best practices & Styleguide 中文版:PyTorch代码规范最佳实践和样式指南 This is not an official st ...
- Java 解析XML数据
实例一:获取指定两个标签之间的数据 XML数据格式: <?xml version="1.0" encoding="utf-8"?> <soap ...
- C++基础 (杂七杂八的汇总 )
继承:继承就是新类从已有类那里得到已有的特性. 类的派生指的是从已有类产生新类的过程.原有的类成为基类或父类,产生的新类称为派生类或子类. 多态:将基类类型的指针或者引用指向派生类型的对象.多态通过虚 ...
- Numba——python面向数组高性能计算库
python在计算性能上相对c是比较弱鸡的,有了numpy后计算性能短板是补了一些,而Numba库又给python计算性能加了发动机(忽然想到西虹市首富王多鱼的名言:我再加200万,给冰山提提速.), ...