zoukankan      html  css  js  c++  java
  • HTML中的div和span

    div和span

    1、div和span都可以称为“图层“。
    2、图层的作用是为了保证页面可以灵活的布局。相当于“盒子”。
    3、div和span是可以定位的,只要确定div的左上角的x轴和y轴坐标即可。
    4、最早的网页是采用table进行布局(不灵活,太死板),现代的网页开发中div布局使用最多。
    5、div和span的区别?
    div独自占用一行(默认情况下,浏览器通常会在其后放置一个换行符);span不会独自占用一行。

    div

    1、<div>标签定义HTML文档中的一个分隔区块或者一个区域部分。
    2、<div>标签常用于组合块级元素,以便通过CSS来对这些元素进行格式化。
    3、可以对同一个<div>标签同时应用class或id属性,但通常情况下我们偏向于只使用其中一种。
    4、为了避免麻烦,可以不必为每一个<div>标签都加上class或id属性。

    span

    1、<span>元素是无语义的行内元素,它可以对元素进行分组,使它们以不同的样式显示。
    2、<span>标签没有固定的格式表现。当对它应用样式时,它才会产生视觉上的变化。如果不对<span>应用样式,那么<span>元素中的文本与其他文本不会任何视觉上的差异。
    3、<span>标签提供了一种将文本的一部分或者文档的一部分独立出来的方式。
    4、可以对同一个<span>元素应用class或id属性,但是更常见的情况是只应用其中一种。这两者的主要差异是,class用于元素组(类似的元素,或者可以理解为某一类元素),而id用于标识单独的唯一的元素。
    5、被<span>元素包含的文本,可以使用CSS对它定义样式,或者使用JavaScript对它进行操作。

    代码示例
    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<title>HTML中的div和span</title>
    	</head>
    	<body>
    		<div id="mydiv" style="color: blue">
    			<h3>这是一个在 div 元素中的标题。</h3>
    			<p>这是一个在 div 元素中的文本。</p>
    		</div>
    		<p>
    			这是一个 
    			<span id="myspan" style="color: red">
    				红色的span
    			</span>
    			标签
    		</p>
    	</body>
    </html>
    

    在这里插入图片描述

  • 相关阅读:
    最长回文子串
    给定两个大小为 m 和 n 的有序数组 nums1 和 nums2。请你找出这两个有序数组的中位数,并且要求算法的时间复杂度为 O(log(m + n))。你可以假设 nums1 和 nums2 不会同时为空。
    MySQL分组查询指定列最新的数据
    GitLab的安装及使用教程(CentOS7)
    ElasticSearch常用RESTful API介绍
    JVM监控——jconsole、
    RocketMq安装运行
    IDEA常用插件-个人
    设计模式:Builder模式
    CentOS常用环境配置(MySQL、jdk、Redis、Nginx)
  • 原文地址:https://www.cnblogs.com/yu011/p/13505561.html
Copyright © 2011-2022 走看看