对于图标,使用fontsize设置大小，而非宽高！

高度不够的时候使用min-height

保持宽高比

四个方向的padding都是相对于 本盒子的宽度来的 常用于视频和图片的展示，比如轮播图。

所以这里把高度去掉，让paddingTop取宽度的50%作为高度，因此实现宽高比为2：1.

CSS奇淫技巧的更多相关文章

  1. 记录一些css奇淫技巧

    文本两端对齐 文字在固定宽度内两端对齐 text-align: justify; text-align-last: justify; 滤镜filter 元素(经常用作图片)置灰效果,类似disable ...

  2. Zepto源码分析（二）奇淫技巧总结

    Zepto源码分析(一)核心代码分析 Zepto源码分析(二)奇淫技巧总结 目录 * 前言 * 短路操作符 * 参数重载(参数个数重载) * 参数重载(参数类型重载) * CSS操作 * 获取属性值的 ...

  3. 优化DP的奇淫技巧

    DP是搞OI不可不学的算法.一些丧心病狂的出题人不满足于裸的DP,一定要加上优化才能A掉. 故下面记录一些优化DP的奇淫技巧. OJ 1326 裸的状态方程很好推. f[i]=max(f[j]+sum ...

  4. 12个实用的 Javascript 奇淫技巧

    这里分享12个实用的 Javascript 奇淫技巧.JavaScript自1995年诞生以来已过去了16个年头,如今全世界无数的网页在依靠她完成各种关键任务,JavaScript曾在Tiobe发布的 ...

  5. NGINX的奇淫技巧 —— 5. NGINX实现金盾防火墙的功能(防CC)

    NGINX的奇淫技巧 —— 5. NGINX实现金盾防火墙的功能(防CC) ARGUS 1月13日 发布 推荐 0 推荐 收藏 2 收藏,1.1k 浏览 文章整理中...... 实现思路 当服务器接收 ...

  6. NGINX的奇淫技巧 —— 3. 不同域名输出不同伺服器标识

    NGINX的奇淫技巧 —— 3. 不同域名输出不同伺服器标识 ARGUS 1月13日 发布 推荐 0 推荐 收藏 6 收藏,707 浏览 大家或许会有这种奇葩的需求...要是同一台主机上, 需要针对不 ...

  7. NGINX的奇淫技巧 —— 6. IF实现数学比较功能 (1)

    NGINX的奇淫技巧 —— 6. IF实现数学比较功能 (1) ARGUS 1月13日 发布 推荐 0 推荐 收藏 3 收藏,839 浏览 nginx的if支持=.!= 逻辑比较, 但不支持if中 & ...

  8. javascript之奇淫技巧

    最近准备面试,复习一下javascript,整理了一些javascript的奇淫技巧~ //为兼容ie的模拟Object.keys() Object.showkeys = function(obj) ...

  9. Gradle更小、更快构建APP的奇淫技巧

    本文已获得原作者授权同意,翻译以及转载原文链接:Build your Android app Faster and Smaller than ever作者:Jirawatee译文链接:Gradle更小 ...

随机推荐

  1. node.js学习4--------------------- 根据不同路径来响应内容,以及中文乱码的解决

    /** * http服务器的搭建,相当于php中的Apache或者java中的tomcat服务器 */ // 导包 const http=require("http"); //创建 ...

  2. Type curtilage home

    This year's National Day coincides with the Mid-Autumn festival, the double false merger about eight ...

  3. python基础 字典练习

    练习1:info = [ {'wangming': { 'money':1111, 'car':['bmo','bsj'], 'info':{ 'phone':1511111, 'age':18} } ...

  4. 2018-2019-2 《网络对抗技术》Exp2 后门原理与实践 Week3 20165326

    Exp2 后门原理与实践 目录 1. 实验原理 2. 实验内容 3. 问题回答 4. 心得体会 实验原理简介 后门:不经过正常流程而访问系统的通道 ncat:底层工具,进行基本的TCP UDP数据收发 ...

  5. session_id() , session_start(), $_SESSION["userId"], header("Location:homeLogin.php"); exit 如果没有登录, 就回登录页

    if(!session_id()) session_start(); header("Content-type:text/html;charset=utf-8"); if (emp ...

  6. php优秀框架codeigniter学习系列——CI_Loader类分析

    这是一个加载视图和文件的类. __construct() 设置视图文件的路径,和获取输出缓冲级别. initialize() 该方法只会被CI_Controller调用一次,会调用 $this-> ...

  7. 10/03/2019 PCL-1.8.1 Ubuntu 16.04 boost 1.69 CUDA 9.0 installation

    cmake -DCMAKE_BUILD_TYPE=None -DBUILD_GPU=ON -DBUILD_CUDA=ON -DBUILD_gpu_kinfu=ON -DBUILD_gpu_kinfu_ ...

  8. vue 用户停留页面超过30分钟未操作 强制退出到登录页面

    先说下主要实现思路,通过给你的根节点绑定mouseover事件,首先声明下当前时间,每次滑过时记录下滑过的时间,两个时间转化成毫秒数,进行对比,如果超过30分钟,则清除token,跳转到login.h ...

  9. yarn安装

    Yarn是Facebook提供的替代npm的工具,可以加速node模块的下载.React Native的命令行工具用于执行创建.初始化.更新项目.运行打包服务(packager)等任务. 先安装nod ...

  10. 【论文阅读】Wing Loss for Robust Facial Landmark Localisation with Convolutional Neural Networks

    Wing Loss for Robust Facial Landmark Localisation with Convolutional Neural Networks 参考 1. 人脸关键点: 2. ...