页面中根据文字的多少自动显示一行或两行，一行的时候高度居中，两行自适应

var t = 50/ $(".shopsinfo-bottom .address li:first p").height();
$(".shopsinfo-bottom .address li:first p").css({
lineHeight:t*16+"px",
height:t*$(".shopsinfo-bottom .address li:first p").height(),

});

注：

50为父标签的高度；

记得引用jquery

时间： 2024-10-13 12:13:23

页面中根据文字的多少自动显示一行或两行，一行的时候高度居中，两行自适应的相关文章

使用CSS3对页面中的文字添加彩色边框

<!doctype html> <html> <head> <meta charset="utf-8"> <title>使用CSS3对页面中的文字添加彩色边框</title> <style> #boarder{ border:solid 5px blue; border-radius:20px; -moz-border-radius:20px; padding:20px; width:180

使用CSS2对页面中的文字添加彩色边框

<!doctype html> <html> <head> <meta charset="utf-8"> <title>使用CSS2对页面中的文字添加彩色边框</title> <style> #boarder{ margin:3px; width:180px; padding-left:14px; border-width:5px; border-style:solid; height:10

系统管理模块_部门管理_改进_抽取添加与修改JSP页面中的公共代码_在显示层抽取BaseAction_合并Service层与Dao层

系统管理模块_部门管理_改进1:抽取添加与修改JSP页面中的公共代码 commons.jspf <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <%@ taglib prefix="s" uri="/struts-tags" %> <meta http-equiv="Conten

实现全屏轮播，并且轮播div中的文字盒子一直自动垂直居中

效果如下: 直接上代码了: 说明:轮播图基于swiper.js,自行下载.css在最后 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.

在做页面的时候为了使页面美化,我们经常会用拼接字符串的方式,动态加载后台的数据,这里我们使用的前台框架是bootstrap,但是很多效果还是要用jquery来实现 (1)方法传参与字符串的拼接 (拼接用的replace) 先声明一个展示数据的页面模型(使用过的模型1) var userModel = "<div class=\"itemdiv commentdiv\" style=\"margin-left: 7%;\">"+ &q

Echarts中axislabel文字过长导致显示不全或重叠

最近在使用Echarts的时候,遇到点问题就是xAxis文字过长导致x轴的文字显示不全. 解决方案如下: 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> 2 <HEAD> 3 <TITLE>my_echarts</TITLE> 4 <META HTTP-EQUIV="Content-Type" CONTEN

解决 “页面中文字增多，字号突然变大” 的问题

在之前一篇文章中,曾记录过一个开发中遇到的问题,在页面中文字增加到一定数量,或者文字大小设置为某一个值时,页面中的文字字号会突然变大,超出自己设置的字号大小. 如下图所示: 虽然我设置的字号大小是24px,但是在computed下却是28.7px,超出我所设置的大小,那么问题来源是什么? 经高人指点后,该问题终于得到了解决,主要问题在于 Font Boosting 特性. 这个特性被称做「Text Autosizer」,又称「Font Boosting」.「Font Inflation」,是 W

自适应页面中如何使用雪碧图

自适应页面你肯定听说过,雪碧图想必你也听说过,不过在自适应页面中使用雪碧图应用的场景却不多,因为很多场景里自适应页面(移动端页面)的小图标啥的基本都做成字体图标了,操作起来也比较方便,不过有时候合成字体图标的时候也比较麻烦,AI制作复杂svg矢量图标很麻烦,今天说的这个应用场景用的就是这个情况: 首先你要知道什么是雪碧图,不知道的先科普之,百毒传送门: 上面说到有的场景添加字体图标很麻烦,如果不理解看下图就明白了: 没错,就是这个国旗,有几十个国家的,这要搞成svg矢量图那要累死了(如果有大神有

php中调用这个功能可以在web页面中显示hello world这个经典单词

php程序写的时间长了,自然对他所提供的功能了如指掌,他所提供的一大堆功能,真是觉得很好用,但有时候会发现php也缺少一些功能,自己总是会产生为php添加一些自定义的功能的想法.久而久之,终于今天憋不住了,开始动手研究如何添加. 下载一个php的源代码包,这里使用的是php 4.0.5版,解压后会看到php的根目录下会有README.EXT_SKEL这样一个文件,打开详细阅读了一下,发现了一个非常好用的工具,这个工具可以帮你构建一个空的php扩展,然后你向里面添加相应的代码就可以完成你自己的功能