程序员经验分享-hwhale

块状元素与内联元素的区别

2023-05-16

css中块状元素是一个重要的知识点，css下height和width不起作用使我们经常遇到的问题，这就需要我们正确区分块状元素和内联元素。

  块状元素和内联元素的区分很简单，我们只需要注意html元素是否排斥其它元素与它同行就可以了。

像font元素定义文字时，你会发现它不排斥与其它内容同行，这个元素就是内联元素。

如何将块状元素转为内联元素呢？

只要我们在元素中添加display：inline；即可

内联元素转为块状元素通过display：block；

块元素(block element)
address - 地址
blockquote - 块引用
center - 举中对齐块
dir - 目录列表
div - 常用块级容易，也是CSS layout的主要标签
dl - 定义列表
fieldset - form控制组
form - 交互表单
h1 - 大标题
h2 - 副标题
h3 - 3级标题
h4 - 4级标题
h5 - 5级标题
h6 - 6级标题
hr - 水平分隔线
isindex - input prompt
menu - 菜单列表
noframes - frames可选内容，（对于不支持frame的浏览器显示此区块内容
noscript - 可选脚本内容（对于不支持script的浏览器显示此内容）
ol - 排序表单
p - 段落
pre - 格式化文本
table - 表格
ul - 非排序列表

下面贴出html元素中内联元素：

a – 锚点

abbr – 缩写

acronym – 首字

b – 粗体(不推荐)

bdo – bidi override

big – 大字体

br – 换行

cite – 引用

code – 计算机代码(在引用源码的时候需要)

dfn – 定义字段

em – 强调

font – 字体设定(不推荐)

i – 斜体

img – 图片

input – 输入框

kbd – 定义键盘文本

label – 表格标签

q – 短引用

s – 中划线(不推荐)

samp – 定义范例计算机代码

select – 项目选择

small – 小字体文本

span – 常用内联容器，定义文本内区块

strike – 中划线

strong – 粗体强调

sub – 下标

sup – 上标

textarea – 多行文本输入框

tt – 电传文本

u – 下划线

var – 定义变量

 

 

转载于:https://blog.51cto.com/8852672/1400873

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

块状元素与内联元素的区别 的相关文章

  • Python 工匠：使用装饰器的技巧。

    作者 xff1a piglei xff08 本文来自作者投稿 xff09 前言 装饰器 xff08 Decorator xff09 是 Python 里的一种特殊工具 xff0c 它为我们提供了一种在函数外部修改函数的灵活能力 它有点像一顶

  • AI听6秒语音就能知道你的长相

    声音可以暴露很多讯息 xff0c 麻省理工学院 xff08 MIT xff09 最近一项研究发现 xff0c 经过训练的 AI 不仅能从声音辨别出性别 年龄和种族 xff0c 甚至能猜出这人大概长什么样子 这些 秘密 都藏不住了 研究人员用

  • selenium编程01-简单163邮箱登陆登出_模块化

    from selenium import webdriver from time import sleep class Login def init self driver self driver 61 driver def login s

  • 163music 反爬分析

    网易163 音乐的 mp3下载 view source https music 163 com playlist id 61 924680166 这个是网页源代码 链接 中间的 拿不到具体的数据 所以获取页面的时候 要去除 http mus

  • 二层链路聚合实验

    交换机1 xff1a ystem view vlan 10 vlan 20 qu interface range g1 0 1 to g1 0 2 port link type access port access vlan 10 qu i

  • plsql

    1 添加快捷键设置 摘抄自https www cnblogs com guangxiang p 9487132 html 汉化版 xff1a 工具 首选项 用户界面 编辑器 自动替换 定义文件 英文版 xff1a Tools gt Perf

  • 如何利用python制作微信好友头像照片墙？

    这个不难 xff0c 主要用到itchat和pillow这2个库 xff0c 其中itchat用于获取微信好友头像照片 xff0c pillow用于拼接头像生成一个照片墙 xff0c 下面我简单介绍一下实现过程 xff0c 代码量不多 xf

  • 软件需求工程与UML建模第二周工作总结

    项目范围 xff1a 1 能够实现仅弹道技能的躲避训练和带有技能发射主体的技能躲避训练 2 要能够玩家自由选择角色进行训练 3 要能够实现包含技能躲避 1v1对线训练等多模式选择的训练方式 4 要能够快捷进行多次练习 xff0c 我们计划加

  • 阻塞和非阻塞~

    很清楚 先记下 https www zhihu com question 19732473 answer 14413599 转载于 https www cnblogs com Mickey697 p 10863679 html

  • vnc利用ps命令查看所有DISPLAY

    ps aux grep vnc 使用该命令可以看到详细的vnc进程和使用的DISPLAY和DISPLAY的分辨率

  • 基础数据类型的补充,编码的进阶,基础数据类型之间的转换

    1 内容总览 基础数据类型的补充数据类型之间的转换 其他数据类型转成bool值为False的情况编码的进阶 2 具体内容 数据类型的补充 str 6个 code str xff1a 补充的方法练习一遍就行 6个 s1 61 39 taiBA

  • Keepalived

    Keepalived双机热备 Keepalived简介 Keepalived是使用C语言编写的路由热备软件 xff0c 该项目软件的主要目标是为Linux系统提供简单高效的负载均衡及高可用解决方案 负载均衡架构依赖于知名的IPVS xff0

  • Scyther 形式化分析工具资料整理（三）

    1 作者Cas Cremers在做TLS1 3的时候我么发现并没有使用Scyther 形式化丰分析工具对其进行分析 xff0c 而是使用了 The Tamarin 作者建立了TLS 13的模型 那么我的目标是 使用Scyther工具对TLS

  • java产生随机数的三种方式

    public class Test public static void main String args Random类 创建随机数对象有2种 一种是添加参数 也叫种子 这种方式创建出来的数 刷新后不会改变 相当于常量了 主要方法 nex

  • gcc 编译两个so其中soA依赖soB

    有两个so xff0c 其中soB中调用soA xff1b 那么我们打包soB的时候连接soA xff1b 在打包test程序的时候连接soB 此时soB会自动查找依赖的soA xff1b 如下测试 在编译之前指定环境变量 xff1a ex

  • Vue 循环 [Vue warn]: Avoid using non-primitive value as key

    页面中不添加 xff1a key 索引的时候 xff0c 会不停的提示虚线 xff0c 但不影响使用 后来加了一个索引 xff0c 加成了 key 61 34 content 34 从后台取出来的contents是一个list xff0c

  • 博客系统 01 登录退出

    一 工程搭建 使用的是IDEA xff08 1 xff09 新建个动态web工程 xff08 Blog xff09 xff08 2 xff09 导入jar包 xff08 SSH jar包 xff09 xff08 3 xff09 导入配置文件

  • 蓝桥杯2017国赛JAVAB组 树形显示 题解

    标题 xff1a 树形显示 对于分类结构可以用树形来形象地表示 比如 xff1a 文件系统就是典型的例子 树中的结点具有父子关系 我们在显示的时候 xff0c 把子项向右缩进 xff08 用空格 xff0c 不是tab xff09 xff0

  • 读《【解密】京东B2B业务架构演变》有感

    京东的B2B业务目前来说发展比较好 xff0c 它的定位是让各类型的企业都可以在京东的 B 平台上进行采购 建立采购关系 京东 B2B 的用户群体主要分为 2 类 xff0c 一类是大 B 用户 另一类是小 B 用户 比如联通 移动公司跟京

  • python中线程、进程和协程的区别

    进程是资源分配的单位线程是操作系统调度的单位协程 xff0c 又称微线程 xff0c 纤程 xff0c 协程的切换只是单纯的操作CPU的上下文 xff0c 资源很小 xff0c 效率高进程切换需要的资源很最大 xff0c 效率很低一个程序至

随机推荐

  • linux下常用alias

    alias xx 61 39 39 其中 61 两边不要有空格

  • C#常用控件(2)

    1 Botton 控件 按钮用图片应该设置内阁为Image xff0c 而不能设置Background为Image xff0c 如果只设置背景 xff0c 按钮鼠标经过样式还在 XAML写法 C 写法 2 Combobox 控件 下拉框控件

  • Django 路由层 虚拟环境下建项目

    路由匹配规律 第一个参数是正则表达式 xff0c 匹配规则按照从上往下一次匹配 xff0c 匹配到一个之后立即匹配 xff0c 直接执行对应的视图函数 urlpatterns 61 url r 39 admin 39 admin site

  • 磁盘显示设备未就绪,要怎么找到资料

    设备未就绪说明这个盘的文件系统结构损坏了 在平时如果数据不重要 xff0c 那么可以直接格式化就能用了 但是有的时候里面的数据很重要 xff0c 那么就必须先恢复出数据再格式化 具体恢复方法可以看正文了解 xff08 不格式化的恢复方法 x

  • centos7下安装vnc更改vnc默认端口号

    应用场景 xff1a 某些情景下 xff0c 需要用的linux的桌面环境 xff0c Ubuntu的桌面性能在linux发行版中算是数一数二的 xff0c 如果不熟悉Debian系统 xff0c Centos RHEL系列也行 xff1b

  • STM32-USB学习笔记（一） USB基础

    USB基础知识扫盲 前言 本文将从USB的 插入检测 身份识别 数据传输三个方面对USB通讯整个过程扫盲 xff0c 其中有些知识点的详细信息会放在文章最下面的附录中供查看 xff0c 从而保证文章的整体简洁 在进入主题之前 xff0c 首

  • VNC连接linux下vmware虚拟机win-server的分辨率设置

    最近用dell的r610装了rhel搞了几个虚拟机玩 xff0c 系统装的是2k3 xff0c 发现用3389连虚拟机的时候 xff0c 分辨率是跟本地一致的1280 1024 xff0c 用vnc连就是1024 768 xff0c 觉得奇

  • 基于maven maven-replacer-plugin 插件对JS，CSS统一加版本号

    2019独角兽企业重金招聘Python工程师标准 gt gt gt 基于maven对JS xff0c CSS统一加版本号 在写WEB应用的时候 xff0c 每次对JS CSS文件做的修改 xff0c 对于用户来说 xff0c 都很郁闷 xf

  • 【树莓派】树莓派上刷android系统

    1 首先将下载的 andrpi3 20160626 img bz2 文件解压 xff0c 可以获得一个 IMG光盘映像文件 xff08 7G多 xff09 xff1b 2 准备1张16G TF卡 xff0c 插入电脑 xff0c 然后运行W

  • 如何应对“需求不确定型项目”？

    问题描写叙述 xff1a 需求不确定 老板直接和客户谈需求 xff0c 项目经理不能或不方便參与 xff0c 打下手 这类项目如何办 xff1f 要深层次了解客户的想法 xff0c 各种利益 xff0c 地盘等 xff0c 这非常难做得到吧

  • 利用CH341A编程器刷新BIOS，恢复BIOS，妈妈再也不用担心BIOS刷坏了

    前几天 xff0c 修电脑主析就捣鼓刷BIOS xff0c 结果刷完黑屏开不了机 xff0c 立刻意识到完了 xff0c BIOS刷错了 就从网上查资料 xff0c 各种方法试了个遍 xff0c 什么用处都没有 终于功夫不负有心人 xff0

  • STM32-串口通信(串口的接收和发送)

    文章目录 STM32的串口通信一 STM32里的串口通信二 串口的发送和接收串口发送串口接收 三 串口在STM32中的配置四 串口接收的两种实现方式1 需要更改的地方2 查询RXNE标志位3 使用中断 总结 STM32的串口通信 本文在于记

  • 技术干货|深入理解flannel

    根据官网的描述 xff0c flannel是一个专为kubernetes定制的三层网络解决方案 xff0c 主要用于解决容器的跨主机通信问题 1 概况 首先 xff0c flannel利用Kubernetes API或者etcd用于存储整个

  • Windows操作系统产品名与内部版本号的对应

    虽然Windows的命名取决于很多因素 xff0c 形式各不相同 xff0c 但是其内部版本号却是一脉相承的 xff0c 从最初的Windows 1 0到之后的Windows 2 0 Windows 3 0 xff0c 再到Windows

  • webpack + jquery + bootstrap 环境配置

    nodejs环境请自行谷歌百度 1 先安装vue cli脚手架 xff1a npm install vue cli g 2 创建项目 xff0c 此处项目名以test为例 xff1a vue init webpack simple test

  • 刚刚，OpenStack 第 19 个版本来了，附28项特性详细解读！

    刚刚 xff0c OpenStack 第 19 个版本来了 xff0c 附28项特性详细解读 xff01 OpenStack Stein版本引入了新的多云编排功能 xff0c 以及帮助实现边缘计算用例的增强功能 OpenStack由一系列相

  • Linux VNC server 安装配置

    1 安装vnc server root 64 pxe yum install tigervnc server y 2 设置 vnc server 开机启动 root 64 pxe chkconfig vncserver on 3 修改vnc

  • 常用非关系型数据库产品介绍

    1 memcache memcache xff08 键值型数据库 xff09 memcache是把访问的数据存在内存里面 xff0c 外部访问现在内存里面找 xff0c 找不到再从数据库里面找 xff0c 可以减轻数据库的压力 xff0c

  • Webpack 4.X 从入门到精通 - devServer与mode（三）

    上一篇文章里详细介绍了一下插件的用法 xff0c 这一篇文章接着丰富module exports里的属性 如今的前端发展已经非常迅速了 xff0c 伴随而来的是开发模式的转变 现在已经不再是写个静态页面并放在浏览器里打开预览一下了 在实际的

  • 块状元素与内联元素的区别

    css中块状元素是一个重要的知识点 xff0c css下height和width不起作用使我们经常遇到的问题 xff0c 这就需要我们正确区分块状元素和内联元素 块状元素和内联元素的区分很简单 xff0c 我们只需要注意html元素是否排斥

热门标签