HTML5 基础知识(1)——基本标签
## HTML
**概念**:是最基础的网页开发语言
(Hyper Text Markup Langage 超文本标记语言)
> 1.超文本:超文本是用超链接的方式i,将各种不同空间的文字组织在一起的网状文本。
> 2.标记语言:由表签构成的语言,如HTML,xml。(标记语言不是编程语言)
**快速入门**:
- 语法:
```css
1.HTML文档后缀名为 .html 或 .htm
2.标签分为:
* 围堵标签:有开始标签有结束结束标签。如:<html> </html>
* 自闭和标签:开始标签和结束标签在一起。如:<br />.
3.标签可以嵌套:需要正确嵌套,不能你中有我,我中有你的形式。
例如:错误:"<a><b></a></b>",正确"<a><b></b></a>"
4.在开始标签中可以定义属性。属性是由键值对构成,值需要引号(单双都可以)引起来
5.HTML的标签不区分大小写,但建议小写。
```
**标签学习**
```javascript
1.文件标签:
HTML:HTML文档的根标签
head:头标签。用于指定HTML文档的一些属性。引用外部资源。
title:标题标签
body:体标签
<!DOCTYPE html>:html5中定义该文档为HTML文档
2.文本标签:
注释:<!--注释内容-->
<h1> to <h6>:标题标签
h1 -- h6 字体大小逐渐减小
<p>:段落标签
<br />:换行标签
<hr />:水平线标签
属性:
color:颜色
width:宽度
size:高度
align:对齐方式
center:居中
left:左对齐
right:右对齐
<b>:字体加粗
<i>:斜体
<font>字体标签(不在使用)
属性定义:
color:
1.英文单词:red,green,blue
2.rgb(值1,值2,值3):值的范围:0~255 如: rgb( 0,0,255)
3,#值1,值2,值3:值的范围:00~FF之间。如:#FF00FF
width:
1。数值:width=‘20’,数值的单位‘px’ ,默认是像素。
2.数值%:占比相对于父元素的比例。
```
**列表标签**
```javascript
1。有序标签:
ol:外层
li:内层
2.无序标签:
ul:外层
li:内层
```
**链接标签**
```javascript
< a >: 定义一个超链接标签
属性:
href:指定访问访问资源的URl(统一资源定位符)
target:指定打开资源的方式
_self:默认值,在当前界面打开
_blank:在新的界面窗口打开
```
**div 和 span:**
```javascript
<div>:每一个div占满一行。块级标签
<span>:文本信息在一行展示,行内标签 内联标签。
```
**语义化标签:**
```javascript
HTML5中为了提高程序的可读性,提供了一些标签
1. <header>:页眉
2. <footer>:页脚
```
**表格标签**
```javascript
1.table:定义一个表格
width:宽度
border:边框
bgcolor:背景色
align:对齐方式
2.tr:定义行
3.td:定义单元格
4.th:定义表头单元格
5.<caption>:表格标题
<thead>:表示表格的头部分
<tbody>:表示表格的体部分
<tfoot>:表示表格的脚部分
```
以上就是一些基本的HTML的标签。
HTML5 基础知识(1)——基本标签的更多相关文章
- HTML5基础知识(一)---标签
在HTML5中,Web页面中重新调整了页面规划,这其中新引入了几个新标记. 我们将创建一个简单的Web页面,该页面包含一个Header区.一个Navigation区.一个Article区(包含三个部分 ...
- HTML5基础知识及相关笔记
HTML5基础 1.1HTML文件的基本结构和W3C标准 1.1.1HTML简介 HTML是一种描述网页的语言,一种超文本标记的语言! 1.1.2HTML文件的基本结构 头部(head) 头部是网页的 ...
- HTML5基础知识(2)--标题标签的使用
1.HTML文档中包含各种级别的标题,各种级别的标题由<h1>到<h6>元素来定义,<h1>至<h6>标题标记中的字母h是英文headline的简称.其 ...
- html5基础知识
html5+css3 html5定义很多简便东西和宽松语法: 文档头: <!doctype html> 文档编码: <meta cha ...
- Web的架构与html5基础知识
图1:完整的Web应用构架 图2:html5的基本结构 head 可添加在头部标签元素有→→title meta style link base script noscript meta 几个重要属性 ...
- HTML和SEO基础知识:H标签全透视
原文地址:http://www.chinaz.com/web/2010/0921/134391.shtml 什么是H标签? h1,h2,h3,h4,h5,h6,作为标题标签,并且依据重要性递减.我认为 ...
- 【前端】之HTML5基础知识
HTML5 文件格式 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...
- HTML5基础知识汇总(一)
一.HTML的开发工具和使用的浏览器 开发工具:记事本等文本编辑器,Atom.VisualStudioCode( VSCode).Brackets.Sublime text和Hbuider. 浏览器: ...
- 前端进阶笔记之核心基础知识---那些HTML标签你熟悉吗?
目录 1.交互实现 1.1 meta标签:自动刷新/跳转 1.2 title标签:消息提醒 2.性能优化 2.1 script标签:调整加载顺序提升渲染速度 2.2 link标签:通过预处理提升渲染速 ...
随机推荐
- bootstrap的button按钮点击之后会有蓝色边框怎么解决?
.btn:focus,.btn:active:focus, .btn.active:focus,.btn.focus, .btn:active.focus,.btn.active.focus { ou ...
- vue2.0学习之动画
下载animate.css <transition name="v"> <div class="content">需要做动画的内容< ...
- Java面试题2-附答案
JVM的内存结构 根据 JVM 规范,JVM 内存共分为虚拟机栈.堆.方法区.程序计数器.本地方法栈五个部分. 1.Java虚拟机栈: 线程私有:每个方法在执行的时候会创建一个栈帧,存储了局部变量表, ...
- JS替换变量中的文字字母
var text='Hello world, Hello world'; var b= text.replace('world','zhengxiaoya'); // 找到字符串中的第一个'world ...
- TreeMap简介
在Map集合框架中,除了HashMap以外,TreeMap也是常用到的集合对象之一.与HashMap相比,TreeMap是一个能比较元素大小的Map集合,会对传入的key进行了大小排序.其中,可以使用 ...
- Qt QString的arg()方法的使用
1.QString的arg()方法用于填充字符串中的%1,%2...为给定的参数,如 QString m = tr("); // m = "12:60:60: 2.它还有另外一种重 ...
- scala语言yield配合for的用法实例
yield配合for的用法 话不多说见实例 package com.donews.reynold /** * Created by reynold on 2017/3/23. */ object Sc ...
- 林轩田机器学习基石课程学习笔记5 — Training versus Testing
上节课,我们主要介绍了机器学习的可行性.首先,由NFL定理可知,机器学习貌似是不可行的.但是,随后引入了统计学知识,如果样本数据足够大,且hypothesis个数有限,那么机器学习一般就是可行的.本节 ...
- Weave实现跨主机容器互联
安装与启动 直接从github下载二进制文件安装. docker_host1(服务器1): 下载weave # sudo wget -O /usr/local/bin/weave https://ra ...
- deeplearning.ai 卷积神经网络 Week 2 卷积神经网络经典架构
1. Case study:学习经典网络的原因是它们可以被迁移到其他任务中. 1.1)几种经典的网络: a)LeNet-5(LeCun et al., 1998. Gradient-based lea ...