01-HTML标签

时间  2019-11-10
标签 html 标签 栏目 HTML 繁體版
原文   原文链接

Python-web

  • HTML经常使用标签

 

HTML

什么是HTML

  • HTML 是用来描述网页的一种语言。javascript

  • HTML 指的是超文本标记语言 (Hyper Text Markup Language)css

  • HTML 不是一种编程语言，而是一种标记语言 (markup language)html

    • 标记语言是一套标记标签 (markup tag)java

  • HTML 使用标记标签来描述网页web

HTML 标签(元素)

  • HTML 标记标签一般被称为 HTML 标签 (HTML tag)。编程

  • HTML 标签是由尖括号包围的关键词，好比 <html>浏览器

  • HTML 标签一般是成对出现的，好比 <b> 和 </b>编程语言

  • 标签对中的第一个标签是开始标签，第二个标签是结束标签搜索引擎

  • 开始和结束标签也被称为开放标签和闭合标签编码

HTML 文档 = 网页

  • HTML 文档描述网页

  • HTML 文档包含 HTML 标签和纯文本

  • HTML 文档也被称为网页

  • Web 浏览器的做用是读取 HTML 文档，并以网页的形式显示出它们。

  • 浏览器不会显示 HTML 标签，而是使用标签来解释页面的内容.

    注意 ：有时候咱们也会把标签说成元素，好比p 标签说成p元素，其实说的就是同一个东西，指示说法不一样而已。

HTML的模板

<!DOCTYPE html>                     <!--文档类型-->
<html lang="en">                    <!--根标签-->
<head>                              <!--网页的头部-->
    <meta charset="UTF-8" />        <!--国际编码 UTF-8-->
    <title>初识HTML</title>         <!--网页标题-->
</head>
<body>                               <!--可视化区域  网页的主体-->
  
</body>
</html>a

HTML标签

H标题标签

  • h1~h6

  • 标题标签 文字大小、粗细程度 、单独占一行

  • 一个页面一般只出现一个h1标签 有利于搜索引擎搜索

  • 每一个页面出现哪些标签，根据本身的需求

p段落标签

  • 独占一行

  • 先后元素自动换行

粗体标签

  • <strong>/<b>

斜体标签

  • <em>/<i>

特殊符号

代码 符号
< < 小于号
> > 大于号
  空格
  空白位
© 版权符
& &符号

换行

  • <br/>换行符

  • <hr/>水平线

a标签（超连接标签）

<a href="#">#</a> 刷新当前页面

<a href="javascript: void(0);">死连接</a> 死连接，不会跳转

<a href="#name">锚点</a>

<a href="http://baidu.com">跳转到百度</a> 跳转到百度  须要注意的是 http 不能少

HTML的书写规范

  • HTML命名规范

    • 名字用小写字母

    • 以英文开头，能够包含（英文字母 _ - 数字），不能使用中文

    • 见名知意

    • 驼峰命名，第二个单词大写，例如：className(js中使用)

  • 命名的2种方式

    • id 只能有一个名字，且在页面中相同的名字只能出现一次，至关于身份证号码同样

    • class相同的名字能够出现N次，而且能够有多个名字，至关于人名字同样

图片标签

语法 ：<img src="图片地址"/>

图片要素

  • src定义图片路径

  • alt图片描述，用于seo给搜索引擎抓取

  • width规定宽度 不给值 默认图片多宽就多宽

  • height规定图片高度 不给值 默认图片多高就多高

  • width height 只给一个值的时候，会等比例缩放

列表

  • 无序列表

<ul>
    <li>我是第1个li</li>
    <li>我是第2个li</li>
    <li>我是第3个li</li>
</ul>  
无序列表就是全部的列表项没有前后顺序之分  默认小黑圆点（disc）
能够经过改变type 值来改变前面的小黑圆点(disc) 空心圆(circle) 小方框(square)

  • 有序列表

<ol>
    <li>我是第1个li</li>
    <li>我是第2个li</li>
    <li>我是第3个li</li>
</ol>
有序列表就是有前后顺序之分 默认是1 2 3
能够经过改变type 值来改变 A 大写字母排序 a小写字母排序 I大写罗马字母排序 i小写罗马字母排序。
H5新增的两个属性：
	reversed 降序排序
	start 有序列表的其实值

  • 定义列表

    <dl>
    <dt>列表标题</dt>	
    <dd>列表项目1</dd>
    <dd>列表项目2</dd>
    <dd>列表项目3</dd>
</dl>

    ​

div 和span标签

div是块级标签，能够包含任何块和行内元素，不会和其余元素同占一行

display:bock默认宽度100%，支持设置宽高，支持全部css命令

span 是内联（行内）标签，能够和其余行内元素位于同一行

display:inline 默认内容撑开宽度，不支持设置宽高

display:inline-block块级能够横排展现，行内支持设置宽高

display:none隐藏元素

相关文章
相关标签/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公众号
   欢迎关注本站公众号,获取更多信息
联系我们 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程