继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

2-HTML基本结构及常用的标签

PIPIONE
关注TA
已关注
手记 1078
粉丝 147
获赞 702

一.网页是什么

  • 网页的组成部分
    一个网页由Html+CSS+JavaScript三部分构成。
    Html: 定义网页元素内容
    CSS: 控制网页样式
    JavaScript:操作网页内容,实现功能或者效果


  • 网页的基本格式
    如下面的代码就是一个标准的HTML网页,里面包含Html,CSS,JavaScript三部分:

<!DOCTYPE html><html><head>
  <meta charset="utf-8"/>
  <title>选项卡标题</title>
  <style>
    h1{        color: red;
    }    p{        background-color: #ff00ff;
    }  </style></head><body>
  <h1>这里是文章标题</h1>
  <p>这是一个段落</p>
  <script>
    alert(1);  </script></body></html>

二.HTML的基本结构

  • HTML的最简单格式:
    一个最基本的HTML页面由文档申明如<!DOCTYPE html>和一个HTML容器组成。而HTML容器里面由<head>部分和<body>两部分组成。所有其他标签都在这两个标签里面:

<!DOCTYPE html><html lang="en"><head>
  <meta charset="UTF-8"/>
  <title>Document</title></head><body>
  </body></html>

三.HTML基本语法规则

1.所有标签都必须包含在<html></html>容器中。
2.HTML中的标签一般都是成对出现的,一个是开始标签一个是结束标签。如<html></html> <body></body>,但也有单标签,如<meta charset="UTF-8"/>
3.结束标签必须有“/”,若是单标签则用“/>”来结束开始标签。例如<br /> <hr />.
4.属性的引用必须要有双引号。例如<td rowspan="3">
5.所有的标签必须合理地嵌套,如<body><p>这是段落</p></body>


四.HTML的常用标签概览

  • [<!DOCTYPE>]
    单独列出说明:[<!DOCTYPE>]是HTML的文档声明,用于定义文档的类型。但是根据W3C官方定义它不是一个HTML标签。


  • 基础标签

标签描述
<html>定义 HTML 文档。
<title>定义文档的标题。
<body>定义文档的主体。
<h1>-<h6>定义 HTML 标题。
<p>定义段落。
<br>定义简单的折行。
<hr>定义水平线。
<!--....-->定义注释。

注:上述标签引用于w3c


  • 其它常用标签

标签描述
<div>定义文档中的节,即页面的一个区块。
<span>定义文档中的节,组合行内元素,以便通过样式来格式化它们
<img>定义图像
<ol>定义有序列表
<ul>定义无序列表
<dl>定义定义列表
<a>定义超链接
<button>定义按钮
<table>定义表格
<form>定义输入的HTML表单

  • HTML全局属性

属性描述
accesskey规定激活元素的快捷键
class规定元素的一个或多个类名(引用样式表中的类)
contenteditable规定元素内容是否可编辑
data自定义属性
dir规定元素中内容的文本方向
draggable规定元素是否可拖动
id规定元素的唯一 id
lang规定元素内容的语言
spellcheck规定是否对元素进行拼写和语法检查
style规定元素的行内 CSS 样式
tabindex规定元素的 tab 键次序
title规定有关元素的额外信息
translate规定是否应该翻译元素内容



作者:饥人谷_刘冲
链接:https://www.jianshu.com/p/581d60ce4ff6


打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP