HTMLCSS————块元素与内联元素

一、块元素与div标签

div是一个块元素,块元素会独占一行,无论它的内容有多少,都会独占一整行。

类似的块元素还有:<p>、<h1>、<h2>、<h3> ·······

然而,<div>标签没有任何语义,就是一个纯粹的块元素,并且不会为它里面的内容设置任何默认样式。它的作用主要是对页面进行布局的

二、内联元素

内联元素也叫“行内元素”,相对于块元素来说,行内元素不会独占一行,只会占用自身内容大小。当一行容纳不下便会自动换行。

类似的行内元素还有:<a>、<img>、<iframe> ·······、<span>

2.1 span标签

span没有任何语义,一般专门用来选中文本,以便为文字设置样式

三、块元素与内联元素的使用规则

块元素主要用来做页面的布局,内联元素主要用来选中文本设置样式。

一般情况下只使用块元素去包含内联元素,而不会使用内联元素包含块元素。

a标签除了它本身之外,可以包含其他任何(块元素或内联元素)元素

p标签不可以包含任何(包括它本身)块元素

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/558860.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

LeetCode算法入门- Compare Version Numbers -day14

LeetCode算法入门- Compare Version Numbers -day14 题目描述&#xff1a; Compare two version numbers version1 and version2. If version1 > version2 return 1; if version1 < version2 return -1;otherwise return 0. You may assume that the version strings a…

HTMLCSS————CSS常用选择器及优先级

选择器优先级 内联样式&#xff08;1000&#xff09;> id选择器&#xff08;100&#xff09;> 类和伪类选择器&#xff08;10&#xff09; > 元素选择器&#xff08;1&#xff09;>通配 * 选择器&#xff08;0&#xff09;> 继承的样式 一、元素选择器 作用&…

LeetCode算法入门- Merge Two Sorted Lists -day15

LeetCode算法入门- Merge Two Sorted Lists -day15 题目描述&#xff1a; Merge two sorted linked lists and return it as a new list. The new list should be made by splicing together the nodes of the first two lists. Example: Input: 1->2->4, 1->3-&g…

2018年度总结

2018年&#xff0c;已经成为过去式&#xff0c;这360多天依旧过的很快&#xff0c;快到当我手扶键盘回想这一年发生的点点滴滴时&#xff0c;都没有任何感慨。可能我天生是个无感之人&#xff0c;或许&#xff0c;这一年的时光&#xff0c;无数的事故、故事已经让我变得不那么感…

LeetCode算法入门- Generate Parentheses -day16

LeetCode算法入门- Generate Parentheses -day16 题目描述 Given n pairs of parentheses, write a function to generate all combinations of well-formed parentheses. For example, given n 3, a solution set is: [ “((()))”, “(()())”, “(())()”, “()(())”, …

2019技术学习规划

引言 前段时间总结了一下2018年的大事小情&#xff08;《2018年度总结》&#xff09;&#xff0c;整体来说还是正能量满满&#xff0c;阅读量涨得也是蛮快的。今天&#xff0c;抽出点时间思考了一下未来一年的规划。那作为技术人才&#xff0c;规划也自然都是技术相关的&#…

LeetCode算法入门- Remove Nth Node From End of List -day17

LeetCode算法入门- Remove Nth Node From End of List -day17 题目解释&#xff1a; Given a linked list, remove the n-th node from the end of list and return its head. Example: Given linked list: 1->2->3->4->5, and n 2. After removing the seco…

Spring Boot————默认缓存应用及原理

引言 应用程序的数据除了可以放在配置文件中、数据库中以外&#xff0c;还会有相当一部分存储在计算机的内存中&#xff0c;这部分数据访问速度要快于数据库的访问&#xff0c;因此通常在做提升数据访问速度时&#xff0c;会将需要提升访问速度的数据放入到内存中&#xff0c;…

LeetCode算法入门- Multiply Strings -day18

LeetCode算法入门- Multiply Strings -day18 题目介绍 Given two non-negative integers num1 and num2 represented as strings, return the product of num1 and num2, also represented as a string. Example 1: Input: num1 “2”, num2 “3” Output: “6” Exampl…

Linux下查看版本及系统信息

一、查看Linux发行版本 [rootlocalhost ~]# cat /etc/issue CentOS release 6.8 (Final) Kernel \r on an \m[rootlocalhost ~]# cat /etc/redhat-release CentOS release 6.8 (Final)二、查看Linux内核信息 [rootlocalhost ~]# uname -a Linux localhost.localdomain 2.6.32…

LeetCode算法入门- Search Insert Position -day19

LeetCode算法入门- Search Insert Position -day19 题目描述 Given a sorted array and a target value, return the index if the target is found. If not, return the index where it would be if it were inserted in order. You may assume no duplicates in the array.…

Linux——VMware虚拟机安装CentOS步骤

一、下载CentOS.iso镜像 最地道的下载方式就是通过官网&#xff0c;大多数的网上连接会直接抛出网易、华为的镜像连接&#xff0c;实际上这些连接都可以在官网找到&#xff1a; 官网地址&#xff08;可直接百度搜索CentOS&#xff09;&#xff1a;https://www.centos.org/ 1…

LeetCode算法入门- Remove Element -day20

LeetCode算法入门- Remove Element -day20 1. 题目描述 Given an array nums and a value val, remove all instances of that value in-place and return the new length. Do not allocate extra space for another array, you must do this by modifying the input array i…

Spring Boot——Redis安装配置与应用整合

引言 Spring Boot默认以ConcurrentHashMap作为缓存容器&#xff0c;但默认的缓存容器在简单的场景使用还是可以的&#xff0c;而作为NoSQL的代表&#xff0c;Redis可以做内存数据库、消息中间件都是不错的&#xff0c;而且有RedisDesktopManager作为可视化管理工具&#xff0c…

利用Aria2高速下载网盘文件

利用Aria2高速下载网盘文件 方法步骤&#xff1a; 下载文件 解压arial2&#xff0c;运行aria2启动.VBS添加插件&#xff0c;解压BaiduExporter-master.zip在Google浏览器扩展程序中chrome://extensions加载已经解压的扩展程序 选择BaiduExporter进行添加即可&#xff0c;打开…

MySQL——JSON_REPLACE()函数修改JSON属性值

引言 由于对mysql的函数并不了解&#xff0c;之前遇到了一个场景&#xff1a; mysql表中有一个字段res_content 是一个由longtext类型&#xff08;可以理解为一个更长的varchar&#xff09;保存的巨大的JSON对象&#xff0c;但是&#xff0c;由于录入的疏忽&#xff0c;导致这…

LeetCode算法入门- Remove Duplicates from Sorted Array -day21

LeetCode算法入门- Remove Duplicates from Sorted Array -day21 题目描述 Given a sorted array nums, remove the duplicates in-place such that each element appear only once and return the new length. Do not allocate extra space for another array, you must do …

Spring Boot整合Redis——自定义RedisSerializer

引言 spring boot简单引入redis依赖&#xff0c;并使用RedisTemplate进行对象存储时&#xff0c;需要使存储对象实现Serializable接口&#xff0c;这样才能够成功将对象进行序列化。 RedisTemplate默认使用的序列化机制是JdkSerializationRedisSerializer&#xff0c;但实际开…

LeetCode算法入门- Implement strStr() -day22

LeetCode算法入门- Implement strStr() -day22 题目描述 Implement strStr(). Return the index of the first occurrence of needle in haystack, or -1 if needle is not part of haystack. Example 1: Input: haystack “hello”, needle “ll” Output: 2 Example …

交易系统如何确保账簿100%准确

转自廖雪峰老师的《交易系统如何确保账簿100%准确》 这篇文章阐述了一个交易系统中对账功能的关键&#xff0c;即&#xff1a;时刻保证资产负债表总额始终为 0。 交易系统中&#xff0c;对账是一个大问题。对账处理不好&#xff0c;不但需要花费大量的人力去处理账簿&#xff…