定义

行内元素只占据它对应标签的边框所包含的空间,没有换行效果

div{
/* 定义行内元素*/
display:inline
}

特点

  1. 多个元素可以横排显示
  2. 不支持宽高和上下margin
  3. 支持padding,上下padding只对自身有效,不影响其他元素
  4. 行内标签不能包含块级标签(a标签除外)
  5. a标签不能包含a标签

常见行内元素

  a标签、b标签、span标签、img标签、strong标签、sub标签、sup标签

  以及一系列表单标签:button标签、input标签、label标签、select标签、textarea标签

html行内元素的更多相关文章

  1. HTML中块级元素与行内元素

    一.行内元素与块级元素 块级元素列表 <address> 定义地址 <caption> 定义表格标题 <dd> 定义列表中定义条目 <div> 定义文档 ...

  2. 1 background(复合属性)与font(复合属性) 2 行内块的间距问题 3 行内元素的margin 4 清除浮动 5定位的元素的层级 6 Border-radius: 边框半径

    1 background(复合属性)与font(复合属性): background: 颜色  图片的链接  是否平铺  背景位置 是否滚动.(可以随意调动或省略) Font: 粗度 字体风格 字体大小 ...

  3. CSS中定位和浮动对行内元素的宽高的影响

    行内元素的大小是由元素里面的内容撑开的宽高决定的,就算在css中对行内元素设置width,height.行内元素也会忽略宽高的设置. 但是当行内元素使用position:absolute或者posit ...

  4. HTML 行内元素和块级元素的理解及其相互转换

    块级元素:div, p(段落), form(表单), ul(无序列表), li(列表项), ol(有序列表), dl(定义列表), hr(水平分割线), menu(菜单列表), table(表格).. ...

  5. CSS里常见的块级元素和行内元素

    根据CSS规范的规定,每一个网页元素都有一个display属性,用于确定该元素的类型,每一个元素都有默认的display属性值,比如div元素,它的默认display属性值为“block”,成为“块级 ...

  6. CSS HACK tab制表符导致行内元素之间的空隙如何解决

    <!DOCTYPE html> <html lang="zh-CN"><head> <meta name="viewport&q ...

  7. 关于行内元素的margin padding一些说明;background-color的范围

    ①当对行内元素使用padding时,只有左右方向(正常)有效:竖直方向上,内边距对于该行内元素有效果,但是对其他元素无任何影响. ②当对行内元素使用margin时,只有左右方向有效,竖直方向无任何效果 ...

  8. CSS行内元素和块级元素的居中

    一.水平居中 行内元素和块级元素不同,对于行内元素,只需在父元素中设置text-align=center即可; 对于块级元素有以下几种居中方式: 1.将元素放置在table中,再将table的marg ...

  9. C#基础-css行内元素、块级元素基础

    一.行内元素与块级元素 块级元素列表 <address> 定义地址 <caption> 定义表格标题 <dd> 定义列表中定义条目 <div> 定义文档 ...

  10. img 默认是行内元素,它旁边的空格是会保留的

    img 默认是行内元素,它旁边的空格是会保留的.因此图片宽度设置百分百后下面会有点找不出原因的间隙. 解决办法:img{display:block}

随机推荐

  1. const 修饰

    int * const grape_jelly; 指针是只读的. const int * grape; int const * grape; 指针所指向的对象是只读的. 对象和指针有可能都是只读的: ...

  2. Linkerd 2.10(Step by Step)—控制平面调试端点

    Linkerd 2.10 系列 快速上手 Linkerd v2 Service Mesh(服务网格) 腾讯云 K8S 集群实战 Service Mesh-Linkerd2 & Traefik2 ...

  3. 自建纯净谷歌搜索「GitHub 热点速览 v.21.35」

    作者:HelloGitHub-小鱼干 虽然 Google 搜索的结果不如百度搜索结果那般广告丛生,但是对于一心只想找到匹配结果的我们而言,推广的信息条目能免则免.whoogle-search 便是一个 ...

  4. rabbitMq镜像集群

    rabbitMq延迟投递的方案 1 把消息记录到数据路,通过定时器进行刷新 2 TTL 加上死信队列 :通过路由把过期的消息同步到死信队列,通过死信队列的消费者进行消费 3

  5. IDEA中的Git操作,看这一篇就够了!

    大家在使用Git时,都会选择一种Git客户端,在IDEA中内置了这种客户端,可以让你不需要使用Git命令就可以方便地进行操作,本文将讲述IDEA中的一些常用Git操作. 环境准备 使用前需要安装一个远 ...

  6. MySQL授权认证

    • MySQL-权限系统介绍 • 权限系统的作用是授予来自某个主机的某个用户可以查询.插入.修改.删除等数据库操作的权限 • 不能明确的指定拒绝某个用户的连接 • 权限控制(授权与回收)的执行语句包括 ...

  7. 超实用的idea技巧,windows技巧,用于节省时间!

    进去https://zhangjzm.gitee.io/self_study 找平常积累,或者其它的

  8. ubantu 编译安装xl2tpd笔记

    1. 下载xl2tpd源码 推荐一个仍在维护的网站:    https://www.xelerance.com/archives/202 也可以从其他的网站下载:例如:https://pkgs.org ...

  9. mysql远程连接以及错误解决&命令行基本操作

    现在大家的程序服务基本都是部署在云服务器上,今天我分享记录一下:使用mysql数据库过程中比较常见操作和遇到的问题 环境:lunix 系统(阿里云服务器,华为云服务器,腾讯云等均适用) + mysql ...

  10. CommonsCollections2 反序列化利用链分析

    在 ysoserial中 commons-collections2 是用的 PriorityQueue reaObject 作为反序列化的入口 那么就来看一下 java.util.PriorityQu ...