<!--

html标签 特征：

    1.空白折叠现象

    2.对空格和换行不敏感

    3.标签要严格封闭

 p标签的嵌套 多注意！！！！！！

html中：

    1.行内标签（不换行）

        （1）在一行内显示  span  strong em i del a

         (2)不能设置宽高  默认的宽和高 是内容填充

        1.1 行内块标签 img input

            (1) 在一行内显示

            (2) 可以设置宽高

    2.块级标签  div p h1~h6

        （1）独占一行

        （2）可以设置宽高,如果不设置宽和高，默认的宽是父亲的100%。高度是内容的高度

        （3）p标签不能装容器级的标签可以装的标签： strong em i u del a span img不可以装的标签：h1~h6 div p

    三种定义样式的方法：

        1 style外部定义

        2 外部css定义

        3 行内定义 如：<p>我的母亲有 <span style="color:blue">蓝色</span> 的眼睛。</p>

-->

<!DOCTYPE html>

<html lang="en">

<head>

    <!--网站配置-->

    <meta charset="UTF-8">

    <!--收索网站 未点开时显示内容-->

    <meta name="Keywords" content="未点开时显示内容 梗概" />

    <!--网页标题-->

    <title>王晓东真帅</title>

    <!--移动端优先 视口设置-->

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!--设置 网页图标-->

    <link rel="shortcut icon" href="E:\面授\python\视频_学习\day36 html\课上代码\day36\fd039245.jpg">

    <!--css的作用修饰标签  静态资源 link 语法-->

    <link rel="stylesheet" href="./index.css">

    <!--匹配body中 所有h2格式的 内容 此处设置颜色为蓝色-->

    <!--在 style 标签直接写就行 .代表class   #代表id 可以单独设置属性-->

    <style type="text/css">

        h2{

            color : blue;

        }

        span{

            color: red;

        }

        <!--这个.表示class-->

        .123{

            color:red

        }

        #top{

            color:gray

        }

    </style>

</head>

<body>

<!--span方法修饰 与del-->

<h3><span>9.9元</span>  <del>79</del></h3>

<!--当div中还有成员的时候设置一个id-->

    <div id="top">

        <!--在内存的div设置一个类-->

        <div class="top-1">左边区域</div>

        <div class="shoping_car">购物<span>车</span></div>

    </div>

<!--h1~ h6 六种字体标签-->

    此处为空白字 无特殊格式

<h1><span class="123">大胖子</span></h1>

    <h2>蓝胖子</h2>

<!--分隔线hr 单闭合标签-->

    <hr />

    <h3>h3号字</h3>

    <h4>死胖子</h4>

<!--以下方法没有换行-->

<!--underline 给文本设置下划线-->

    <u>下划线</u>

<!--斜体 两种方法 em  i-->

    <i>斜体i</i>

    <em>斜体em</em>

<!--2在5的上方看起来像 平方  sub 在下方--><sup>2</sup>

<!--p标签不能装容器级的标签

    可以装的标签： strong em i u del a span img

    不可以装的标签：h1~h6 div p

-->

    <p>

        <strong>pppp加粗</strong>

        <span>p中的span</span>

    </p>

<!--超链接标签a  #号叫做锚点：锚点作用是点击不跳转其他页面一般用于调试 或者跳回网页顶端或者低端-->

    <p>

        <a href="#" id="anchor" class="anchor" title="百度云">设置锚点点击一下</a>

    </p>

    <div>

        <a href="https://www.baidu.com/" id="111" class="111">a标签链接——点击一下</a>

    </div>

<!--图片链接-->

<!--img标签为单标签  src：图片路径  alt:当找不到图片或图片错误无法显示的时候会显示alt中的内容  -->

<!--width:设置图片宽  height：设置图片高 图片都是自动按大小缩放，所以宽高尽量只设置一个 -->

    <img src="http://pic.58pic.com/58pic/13/86/02/97958PICtWN_1024.jpg" alt="网络图片加载失败显示内容" height="300" >

<!--form 标签：带有两个输入字段和一个提交按钮的 HTML 表单  type:表示类型如文本、按钮  name:用作外部io操作  value:默认值一般不写 -->

    <form action="https://www.baidu.com/s">

        <input type="text" name="pwd" value="12306">

        <input type="submit" value="搜索">

    </form>

</body>

</html>

html基本标签介绍及应用的更多相关文章

  1. java web学习总结(二十七) -------------------JSP标签介绍

    一.JSP标签介绍 JSP标签也称之为Jsp Action(JSP动作)元素,它用于在Jsp页面中提供业务逻辑功能,避免在JSP页面中直接编写java代码,造成jsp页面难以维护. 二.JSP常用标签 ...

  2. html常用标签介绍

    常用标签介绍 文本 最常用的标签可能是<font>了,它用于改变字体,字号,文字颜色. 点击查看效果 <font size="6">6</font&g ...

  3. 一、JSP标签介绍,自定义标签

    一.JSP标签介绍 1. 标签库有什么作用 自定义标签库是一种优秀的表现层技术,之前介绍的MVC模式,我们使用jsp作为表现层,但是jsp语法嵌套在html页面,美工还是很难直接参与开发,并且jsp脚 ...

  4. 前端入门html（标签介绍）

    day47 参考:https://www.cnblogs.com/liwenzhou/p/7988087.html # web本质 示例 import socket sk = socket.socke ...

  5. 3-[HTML]-head标签介绍

    1.head标签 我们首先来介绍一下head标签的主要内容和作用,文档的头部描述了文档的各种属性和信息,包括文档的标题.编码方式及URL等信息,这些信息大部分是用于提供索引,辩认或其他方面的应用(移动 ...

  6. WEB学习-基础知识：列表、表单、div和span、注释、字符实体、HTML废弃标签介绍

    列表 无序列表 无序列表,用来表示一个列表的语义,并且每个项目和每个项目之间,是不分先后的. ul就是英语unordered list,“无序列表”的意思. li 就是英语list item , “列 ...

  7. noscript 标签介绍

    noscript 标签介绍 一.总结 一句话总结: noscript 标签在不支持JavaScript 的浏览器中显示替代的内容. 1.noscript标签使用实例? html标签直接放在noscri ...

  8. template标签介绍和使用

    template标签介绍和使用 1.介绍:template标签是html5新出来的标签,具有3个特点,(1)随意性:可以写在页面中的任何地方.(2)不可见性:它里面的元素都是不可见的.(3)页面也不会 ...

  9. 2、Spring的IOC标签介绍以及实例

    一.Spring_ioc配置文件bean标签介绍 1. bean标签 名称:bean 类型:标签 归属:beans标签 作用:定义spring中的资源,受此标签定义的资源将受到spring控制 格式: ...

  10. html 不常用标签介绍

    文本元素 <wbr> 如果单词太长,或者您担心浏览器会在错误的位置换行,那么您可以使用 <wbr> 元素来添加 Word Break Opportunity(单词换行时机).英 ...

随机推荐

  1. WEB APP 开发标签

    第一个meta标签表示:强制让文档的宽度与设备的宽度保持1:1,并且文档最大的宽度比例是1.0,且不允许用户点击屏幕放大浏览: 第二个meta标签是iphone设备中的safari私有meta标签,它 ...

  2. Log4J是Apache组织的开源一个开源项目，通过Log4J，可以指定日志信息输出的目的地，如console、file等。Log4J采用日志级别机制，请按照输出级别由低到高的顺序写出日志输出级别。

    Log4J是Apache组织的开源一个开源项目,通过Log4J,可以指定日志信息输出的目的地,如console.file等.Log4J采用日志级别机制,请按照输出级别由低到高的顺序写出日志输出级别. ...

  3. 网络I/O：Socket→RMI

    ★Socket Socket编程可能大家都很熟,所以就不多讨论了,只是说通过socket把数据保存到远端服务器或从网络socket读取数据也不失为一种值得考虑的方式. ★RMI RMI机制其实就是RP ...

  4. Django Admin后台管理模块的使用

    Admin后台管理模块的使用 Django的管理员模块是Django的标准库django.contrib的一部分.这个包还包括其它一些实用的模块: django.contrib.auth django ...

  5. IOS无限自动循环滚动banner(源码)

    本文转载至 http://blog.csdn.net/iunion/article/details/19080259  目前有很多APP都开始使用一些滚动banner,我自己也做了一个,部分算法没有深 ...

  6. python3 简单爬虫

    爬取虎牙直播分类页面的主播的头像,名字,人气 今天学习了python3爬虫,上课闲着无聊,自己写了一个爬虫 就顺着老师思路 爬了虎牙直播分类页面的主播,头像,名字,和人气 HuYaCateScrapy ...

  7. jQuery与Zepto

    jQuery和Zepto是我比较常用的插件.其实用法差不太多,可以说Zepto是jQuery的轻量级替代品,但是不要认为Zepto就没有jQuery好用,因为Zepto有jQuery没有的功能,就是移 ...

  8. python之MySQL学习——防止SQL注入（参数化处理）

    import pymysql as ps # 打开数据库连接 db = ps.connect(host=', database='test', charset='utf8') # 创建一个游标对象 c ...

  9. mysql 数据库表名大小写问题

    lower_case_table_names=1 原来Linux下的MySQL默认是区分表名大小写的,通过如下设置,可以让MySQL不区分表名大小写:1.用root登录,修改 /usr/my.cnf: ...

  10. Taylor's theorem

    w https://en.wikipedia.org/wiki/Taylor_series