inline-block 第73页

前端笔记3

1.CSS样式-display-用来设置元素的显示类型-可选值：none元素不会在页面显示，并且不会占据页面的位置block元素作为块元素显示inline元素作为内联元素显示inline-block元素作为行内块元素显示

从精通到陌生·2019-11-21 00:00

【前端知识体系-CSS相关】CSS布局知识强化

表格布局float+margin布局inline-block布局flexbox布局（兼容性的问题）1.1基础布局*{margin:0;padding:0;}.layout{margin-top:10px

Web前端社区·2019-11-17 18:00

纯CSS实现导航栏下划线跟随的示例代码

aaaabbbbbbbccccddddeeeecss：ul{padding:0;margin:0;font-size:0;}li{font-size:20px;padding:5px15px5px15px;display:inline-block

·2019-11-13 12:57

微信小程序之页面传值并且根据产品类别（主从关系）的赋值操作

font-size:26rpx;color:#111;}.rightBorder{padding-right:6vw;}.sb{padding-top:5vw;}.titleName2{display:inline-block

晨曦_yuan小海·2019-11-12 18:00

关于居中布局

text-align.parent{background:lightblue;text-align:center;max-width:300px;}.child{background:lightslategrey;display:inline-block

Kailee·2019-11-12 11:17

仿制某浪密码验证提示信息

依旧会用到表单元素和p标签提示主要是用到p.className="aa1";给元素添加类名的属性：div{width:600px;margin:90pxauto;}.a{display:inline-block

牛耀民·2019-11-09 22:00

编程作业-2017.1.20

这次又留了两道编程题(￢︿￢)①用三种方法使div元素并列摆放嗯，相信看过视频的人都能想到这三种方法就是：浮动法内联块法（inline-block）定位法代码↓↓↓div并列——浮点div{width:

黑猫乄·2019-11-08 21:27

CSS第二节：CSS性质

1.display可以让行内元素跟块级元素相互转换,e.g.inline，block，inline-block，none2.visibilityanddisplay的不同在于，visibility只是不显示

becauseyou_90cd·2019-11-08 17:23

display:inline、block、inline-block的区别

display:block就是将元素显示为块级元素.block元素的特点是：*总是在新行上开始；*高度，行高以及顶和底边距都可控制；*宽度缺省是它的容器的100%，除非设定一个宽度display:inline就是将元素显示为行内元素inline元素的特点是：*和其他元素都在一行上；*高，行高及顶和底边距不可改变；*宽度就是它的文字或图片的宽度，不可改变inline和block可以控制一个元素的行宽

燃烧吧_小宇宙·2019-11-08 06:07

页面布局-居中 2.16

table-cell+vertical-align.parent{text-align:center;display:table-cell;vertical-align:middle;}.child{display:inline-block

李明104·2019-11-07 22:39

css中inline、block、inline-block的区别

display:block就是将元素显示为块级元素.block元素的特点是：总是在新行上开始；高度，行高以及顶和底边距都可控制；宽度缺省是它的容器的100%，除非设定一个宽度,,,,和是块元素的例子。display:inline就是将元素显示为行内元素.inline元素的特点是：和其他元素都在一行上；高，行高及顶和底边距不可改变；宽度就是它的文字或图片的宽度，不可改变。,,,,,和是inline元

xqchen·2019-11-07 19:15

如何灵活的运用before和after

__arrow{display:inline-block;padding:10px;back

KlivitamJ·2019-11-07 18:50

元素自适应内容宽度

内联元素会自动的实现对内容宽度的自适应这里是子元素，我的字数不是固定的哦~对于这种我们给父元素设置一个宽度，如果子元素不加设置的话，会发现其实子元素是默认占据了父元素的全部的，不是我们想要的效果解决方案：在子元素中设置：display:inline-block

秋夜已凉·2019-11-07 03:45

JS数据类型，类型转换

ECMAScript：标准、核心HTML标签类型：block、inline、inline-block、table……JS中的数据类型：数字(Number)、字符串(String)、布尔(boolean)

洋葱大大·2019-11-07 02:25

透明球体

height:600px;margin:20pxauto;background-color:#082236;}.ball{border:1pxsolidrgba(0,176,188,0.3);display:inline-block

眠九·2019-11-06 20:33

正则表达式批量修改rem数值

打开控制台souces->snippets->新建snippets->保存->右键run->控制台得到结果`.com-footer.btn{display:inline-block;width:9.03rem

smaVivian·2019-11-06 17:43

闭合内部浮动引发的hasLayout、BFC学习

开胃小菜，拈来尝尝1.在最后一个浮动元素的下面添加空白标签 or 2.父元素overflow:hiddenIE6不支持;一旦子元素的大小超过父容器的大小，就会出显示问题3.父元素display:inline-block

Candy程·2019-11-06 16:18

事件应用代码备份和Tab组件

JSBintab1tab2tab3内容1*{margin:0;padding:0}div{border:1pxsolid#aaaaaa}#bigger{padding:5px;width:500px}.tabs{display:inline-block

毕子歌·2019-11-06 15:54

总结

块级格式化上下文根元素，float属性不为none，position属性为absolute或fixeddisplay为inline-block，table-cell，table-caption，flex

小豆soybean·2019-11-06 14:07

block，inline和inline-block的概念与区别

总体概念block和inline这两个概念是简略的说法，完整确切的说应该是block-levelelements(块级元素)和inlineelements(内联元素)。block元素通常被现实为独立的一块，会单独换一行；inline元素则前后不会产生换行，一系列inline元素都在一行内显示，直到该行排满。大体来说HTML元素各有其自身的布局级别：常见的块级元素：div,form,table,p,

饥人谷_张洋源·2019-11-06 01:21

task 11

如果父元素有边框，或有内边距则不会出现合并；相邻元素间的合并：有外边距则会合并；设置元素为float,inline－block,overflow:auto(BFC)则可以消除合并。

饥人谷_姜琼君·2019-11-05 23:38

CSS实现div根据内容自动适应

parent{width:400px;height:400px;border:1pxsolidred;}.children{border:1pxsolidblue;height:50px;display:inline-block

贞贞姐·2019-11-05 19:00

css常见样式（下）

能让什么元素水平居中text-align:center用于设置块级元素中的行内元素水平居中,text-align对inline-block也有效IE盒模型和W3C盒模型有什么区别?

饥人谷_二釉·2019-11-05 19:00

任务六问答题

比如inline-block哪些浏览器支持？查看css样式的文件一般caniuse网站三、a标签的h

崔敏嫣·2019-11-05 19:55

去除inline-block造成的元素之间的空白

对多个元素使用inline-block会在元素之间填充空白文本，在显示上就是两个元素之间有间隙。

就叫初九吧·2019-11-05 03:51

css样式中三角形的应用

Titlebody{margin:150pxauto0;text-align:center;background:#6d6d6d;}h3{margin-bottom:50px;}.tooltip{display:inline-block

eternalshallow·2019-11-05 00:10

CSS常见的元素居中的方式

box{width:80px;margin:0auto;}3.对于不定宽度的块级元素，将子元素设置为inline-block,再设置父元素text-align:c

酷鼠666·2019-11-04 13:44

使用before及after设置定位问题（使用环境：react及scss）

使用环境：react及scsshtml中:常见问题css中:.desc{position:relative;font-size:12px;text-align:center;display:inline-block

yzr_0802·2019-11-04 03:11

CSS 居中小结

水平居中行内或类行内元素在块级父容器中让行内元素居中，只需使用text-align:center;：这种方法可以让inline/inline-block/inline-table/inline/flex

莱昂纳德刚·2019-11-04 02:55

处理inline元素之间换行产生的空白

图片来自网络inline,inline-block元素之间的换行符会造成类似空格的空白。不知道你遇到过没？比如以下代码：12这种问题对布局影响不大，容易被忽略。但是某些极端情况就会把这个问题放大。

乘着风·2019-11-04 01:12

表单

margin让上下的input有一定的间距2、.form-control让input的宽为100%3、建议使用label，有利于屏幕阅读器的识别4、元素添加.form-inline类可使其内容左对齐并且表现为inline-block

Amy_yqh·2019-11-03 19:02

各类元素的水平垂直居中

一、水平居中行内元素：text-align:center适用元素：文字，链接，及其其它inline或者inline-*类型元素（inline-block，inline-table，inline-flex

叶猜·2019-11-03 10:54

tab切换和模态框

.box{margin:100pxauto;border:1pxsolid#ddd;width:350px;height:300px;overflow:hidden;}.mtspan{display:inline-block

小囧兔·2019-11-03 06:53

CSS——布局布局神器display:table-cell

左右布局能用display:inline-block;布局我就用它来布局，但是还是无法完全不使用它，很多布局例如需要靠左和靠右的布局场景下就没办法不去使用float来布局。元素两端对齐第一个案例是让两

单纯的土豆·2019-11-03 06:46

text-align

即使属性说是“文本”对齐，但它会影响块级元素内的所有元素，它们是inline或inline-block元素。text-align仅影响应用其的元素内的内容，而不影响元素本身。

Hushaby丶·2019-11-03 05:15

JS实现多选框添加删除

需求背景：需要实现小组管理(不多介绍)image.png数据超出长度显示省略号.memname{display:inline-block;text-overflow:ellipsis;overflow:

艾丝凡阿斯蒂芬·2019-11-03 03:09

7、浮动布局和BFC

浮动布局：实现：方式一：display:inline-block弊端：存在代码换行被解析方式二：float:left优点：避免代码换行被解析可左右浮动浮动的特性：1.浮动的元素排在同一行2.浮动的元素内容撑开宽度

IUVO·2019-11-03 03:34

CSS中display:inline-block的作用？

display有3种常见的属性值：inline、block、inline-block。inline就是以内联元素方式呈现，block就是以块级元素呈现。

小碗碗碗碗·2019-11-03 02:45

伪类设置文字对齐

使用伪类设置文字对齐经常前端网页会有需求设置文字对齐,例如:姓名联系方式蠢一点的做法是加空格姓名联系方式但是不同字体所对的空格是不同的,这和设计师所设计字体时的规定有关系.伪类::afterspan{width:5em;display:inline-block

YjjTT·2019-11-03 01:29

关于inline、block、inline-block

首先解释一下什么是块级元素与行级元素（内联元素）1.block元素通常被显示为独立的一块，单独占一行；inline元素前后不会产生换行，一系列inline元素都在一行内显示，直到这一行排满。常见的块级元素有div,form,table,p,pre,h1~h6,dl,ol,ul等。常见的内联元素有span,a,strong,em,label,input,select,textarea,img,br等

叛经离道·2019-11-02 22:39

CSS：如何清除a标签之间的默认留白间距

即使我们使用了类似*{margin:0;padding:0;}这样的代码重置了浏览器默认样式,也会发现类似a标签这种inline-block元素，它们之间也还存在着间距。

JS_swh·2019-11-02 22:10

用display table-cell实现等高的两栏布局

下面将介绍3种实现方式（inline-block,table-cell,flex-box），并进行对比。

faye0907·2019-11-02 21:58

【前端】-017-页面制作-CSS-布局

、、、、、、、inline-block，内联块状元素默认内容宽度可以设置宽度和高度前后元素同行显示后续元素or本身会？整块换行常用标签元素：、、...none，

程德山·2019-11-02 20:11

CSS常见样式2

（这里面的行内元素包括文本，行内元素，设置display：inline-block的块级元素）该属性可以被继承。

ychenxi·2019-11-02 16:38

CSS 居中的各种方案

水平居中行内或行内块元素.container{text-align:center;}单个块级元素.item{margin:0auto;}多个块级元素inline-block方案.con

水剑承王·2019-11-02 14:02

最全Html和CSS布局技巧

水平居中水平居中的页面布局中最为常见的一种布局形式，多出现于标题，以及内容区域的组织形式，下面介绍四种实现水平居中的方法注：下面各个实例中实现的是child元素的对齐操作，child元素的父容器是parent元素1.1.1使用inline-block

白水螺丝·2019-11-02 13:04

几种垂直居中的方法

如果父容器不固定高度，padding/line-height（慎用）即可实现元素的垂直居中demo-1demo-1如果父容器固定高度display:table-celldemo-2demo-2display:inline-block

楓丶無痕·2019-11-01 19:20

inline、block、inline-block笔记

block和inline的区别，block就是让其形成块级元素，而且其前后都会有换行符；块级元素，就是一个四方块，可以放在页面上任何地方。inline的话就是让元素设置为内联样式（行内元素）（对其设置的宽高都没有什么卵用，不产生效果，但是颜色效果还是有的），前后是没有换行符的。行内就是在一行内的元素，只能放在行内。说白了，行内元素就好像一个单词，块级元素就好像一个段落，如果不另加定义的话，它将独立

横竖撇捺啊·2019-11-01 18:18

开发过程中遇到的一些奇妙的事情(css)：

开发过程中遇到的一些奇妙的事情：1.font-size:0；display：inline-block的元素之间会有一个字符的间隙，这个间隙导致了最后一个会掉下来。

HW_____T·2019-11-01 17:56

盒模型

能让什么元素水平居中文字居中或者让inline-block居中，一般作用在块级元素上或者inline-block上，能让块级元素里的文字和inline-bloc

饥人谷__小圆·2019-11-01 07:02

推荐频道

inline-block