如图:

代码:(需要将li中vertical-align属性设置为bottom)

<ul style="margin-top:50px">
  <li style="background-color:#19b955;display:inline-block;width:120px;height:60px;font-size:22px;text-align:center;line-height:60px;color:#fff">
    描述
  </li>
  <li style="vertical-align:bottom;display:inline-block;width:120px;height:50px;font-size:18px;background-color:#e0e0e0;line-height:50px;text-align:center">
  附加信息
  </li>
</ul>

CSS------让ul中高度不同的li底部对齐的更多相关文章

  1. 选中多个<ul>中的第一个<li>方法

    获取第一个ul中的第一个li标签的方法: //获取第一个ul中的第一个li /* $("ul li:first").css("background"," ...

  2. CSS布局之div交叉排布与底部对齐--flex实现

    最近在用wordpress写页面时,设计师给出了一种网页排布图样,之前从未遇到过,其在电脑上(分辨率大于768px)的效果图如下: 而在手机(分辨率小于等于768px)上要求这样排列: 我想到了两种方 ...

  3. Html中怎么用CSS让ul中多个li标签不换行横排显示

    布局 通常有三种方式 { 1. position 2. float: left --> 其次是这个 3. block: inline-block  --> 他们推荐我用这个 } 具体描述 ...

  4. jquery获取ul中的第一个li

    $("ul li:first"); $("ul li").eq(0);$("ul li").first();$("ul li&qu ...

  5. Javascript DOM 02 在<ul>中创建、删除 <li>

    创建DOM元素 createElement(标签名)  创建一个节点 appendChild(节点)  追加一个节点 例子:为ul插入li 插入元素 insertBefore(节点, 原有节点)  在 ...

  6. css控制ul标签下的指定li标签样式

    ul li:first-child{ }  第一个ul li:last-child{ }   最后一个ul li:nth-child(4){ } 指定第几个,4就是代表第四个ul li:nth-chi ...

  7. 多个ul中第一个li获取定位

    如果我们只是获取一个ul中的第一个li的话,那么我们可以这样写: $("ul li:first"); $("ul li").eq(0); $("ul ...

  8. Jquery和JS获取ul中li标签(转)

    js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...

  9. Jquery和JS获取ul中li标签

    js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...

随机推荐

  1. GDOI2018 Day1 题目总结

    T1:农场 题意:有一个长为 $n$ 的序列 $a$,要求将其分成尽可能多的部分,使得每一部分的 $a_i$ 的和相等.求最多能分成的部分数. $30\%:1\le n\le 1000$ $80\%: ...

  2. jQuery源码之 empty与html('')的区别

    empty: function() { var elem, i = 0; for ( ; (elem = this[i]) != null; i++ ) { // Remove element nod ...

  3. 使用 yield 减少内存消耗

    php 里面想要处理一个文本文件,有一个方法是使用 file() 函数,但是这个函数会读取文件所有内容,可能会导致占用很大内存. // 28.1 M 的文本文件, 200w 行 $file = 'st ...

  4. valgrind使用指南

    http://note.youdao.com/noteshare?id=5de9c049ccdb1defdc4368db83813dd3

  5. git-jenkins-k8s构建tomcat项目实践

    相关环境(部署安装略...):jenkins 安装k8s 集群环境部署docker 私有仓库搭建 jenkins 创建项目 Execute shell 构建docker镜像上传到私有仓库,以构建时间做 ...

  6. Angular.js浅谈

    至今博主对于MVVM框架比较了解的就只能算有Angular了,首先给大家明确一个概念,Angular1.x才能叫Angular.js,而Angular2.4.5都直接叫Angular了,因为从2开始已 ...

  7. python---基础知识回顾(三)(面向对象)

    一.多继承(寻找方法) 主要学习多继承中的寻找方法的方式:分别是深度优先和广度优先 1.当类是经典类时,多继承情况下,会按照深度优先方式查找 2.当类是新式类时,多继承情况下,会按照广度优先方式查找 ...

  8. Struts2_day02

    一.内容大纲 1 结果页面配置 (1)全局结果页面 (2)局部结果页面 - 配置全局也配置局部,最终局部为准 (3)result标签type属性 - 默认值 dispatcher做转发 - redir ...

  9. 封装JSON数据转自定义HTML方法parseHTML

    开发过程中经常使用字符串拼接,这样做工作效率低,可维护性和易读性也比较差,且对于后台程序员对html不熟悉,经常出错. 如下面例子json转字符串: var json = [{ href:'http: ...

  10. HDU 2159 FATE (二维背包)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2159 解题报告:这题实际上是一个二维的背包问题,也可以由01背包扩展而来,01背包用一维数组,可想而知 ...