html 右边框变短,HTML / CSS：使边框右侧高度动态化

3 个答案:

答案 0 :(得分：0)

＆＃13;

#ColumnOne,

#ColumnTwo,

#ColumnThree,

#ColumnFour {

border-right: 1px solid;

display: table-cell;

vertical-align: top;

}＆＃13;

SAMPLE TITLE

111

222

333 333

333

444 444

444

＆＃13;＆＃13;＆＃13;

答案 1 :(得分：0)

您可以使用jQuery height方法获取每列的高度，将它们放入数组中，然后使用JavaScript Math.max函数计算最大高度：

＆＃13;

$(function() {

var arr = [

$("#ColumnOne").height(),

$("#ColumnTwo").height(),

$("#ColumnThree").height(),

$("#ColumnFour").height()

];

$("#ColumnOne, #ColumnTwo, #ColumnThree, #ColumnFour").height(Math.max.apply(Math, arr));

});＆＃13;

#ColumnOne,

#ColumnTwo,

#ColumnThree,

#ColumnFour {

float: left;

border-right: 1px solid;

}＆＃13;

111

222

333 333

333

444 444

444

＆＃13;＆＃13;＆＃13;

答案 2 :(得分：0)

Flexbox可以做到这一点

#ColumnOne,

#ColumnTwo,

#ColumnThree,

#ColumnFour {

border-right: 1px solid;

float: left;

}

#MAIN {

display: flex;

}

SAMPLE TITLE

111

222

333 333

333

444 444

444

html 右边框变短,HTML / CSS：使边框右侧高度动态化相关推荐

html中不显示竖线边框代码,DIV用CSS定义边框为实线，但为什么预览的时候不显示。...
DIV用CSS定义边框为实线,但为什么预览的时候不显示.以下文字资料是由(历史新知网www.lishixinzhi.com)小编为大家搜集整理后发布的内容,让我们赶快一起来看一下吧! DIV用CSS定 ...
html边框阴影咋设置,css阴影边框怎么设置
css阴影边框的设置方法:首先新建一个html文件:然后在这个html文件上创建两个[ ]用来设置阴影边框:最后这两个div添加样式类为in.out. 本教程操作环境:windows10系统.css3 ...
CSS | 使一个元素高度由图片撑开
需求: 期望左边的高度由右边的图片决定,因此右边的元素需要由右侧的图片来撑开,但是开发时发现出现了以下问题: 右侧的元素没有被图片撑开,而是比图片多了一些距离. 解决 <div stlyle=& ...
css使两个盒子并列_css如何去掉重叠部分的边框？
在前端开发中,边框border属性是经常会用到的一个属性,它可以给元素添加边框:但两个相邻的元素在一起同时添加了边框,就会出现一个问题,边框会重叠在一起(如下图),那么如何去掉重叠部分的边框? web ...
html 图片变灰,科技常识：css使图片变灰的实现方法
今天小编跟大家讲解下有关css使图片变灰的实现方法 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关css使图片变灰的实现方法的相关资料,希望小伙伴们看了有所帮助. 如果您是想将页面网页 ...
html边框自动变颜色,CSS设置边框颜色 css布局边框颜色
一.边框颜色样式单词 border-color:#000(设置4边边框颜色为黑色) border-color:+颜色值,即可设置对象边框颜色 border-left-color:#000 设置左边框颜 ...
短语文:很好很强大全民参与正在使语文变短zz
长篇文学是少数人的工作,制造短语文,却是全民的乐子. 你也许没有意识到,你也是这个时代语文的创造者. ◎本版撰文/本报记者曲慧(除署名外) ■签名档和短信都接在你的名字后面,理所当然地将成为你的&q ...
css使两个盒子并列_你需掌握的CSS知识都在这了（长文建议收藏，文末有福利）...
(给前端大学加星标,提升前端技能.) 作者:深圳湾码农 https://juejin.im/post/5d8336d2f265da03df5f4a06 1.CSS盒模型,在不同浏览器的差异 css 标 ...
css使两个盒子并列_盒子模型(重点)
所谓盒子模型就是把HTML页面中的元素看作是一个矩形的盒子,也就是一个盛装内容的容器.每个矩形都由元素的内容.内边距(padding).边框(border)和外边距(margin)组成. 看透网页布局 ...

html 右边框变短,HTML / CSS：使边框右侧高度动态化

html 右边框变短,HTML / CSS：使边框右侧高度动态化相关推荐

最新文章

热门文章