table中的td可以在页面中直接在元素上设置width；但是li不能只能在页面中写style；

<!-- <li  width="20%" class="p-box">1</li>

                    <li  width="20%" class="t-box">2</li>

                    <li  width="20%" class="m-box">3</li>

                    <li  width="20%" class="o-box">4</li>

                    <li  width="20%" class="st-box">5</li> -->

                    <li  :style="{width:personData.t}" class="p-box">1</li>

                    <li  :style="{width:personData.t}" class="t-box">2</li>

                    <li  :style="{width:personData.t}" class="m-box">3</li>

                    <li  :style="{width:personData.t}" class="o-box">4</li>

                    <li  :style="{width:personData.t}" class="st-box">5</li>

注释的是错误的方式，只有在td中可直接使用

width百分比的更多相关文章

  1. 【学习笔记】响应式布局的常用解决方案（媒体查询、百分比、rem、和vw/vh）

    原文转载:https://blog.csdn.net/sinat_17775997/article/details/81020417 一.媒体查询 不同物理分辨率的设备,在还原设计稿时,css中设置的 ...

  2. 详解用CSS3制作圆形滚动进度条动画效果

    主  题 今天手把手教大家用CSS3制作圆形滚动进度条动画,想不会都难!那么,到底是什么东东呢?先不急,之前我分享了一个css实现进度条效果的博客<CSS实现进度条和订单进度条>,但是呢, ...

  3. Python 【第七章】：Html 和 CSS

    HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写,他是一种制作万维网页面标准语言(标记).相当于定义统一的一套规则,大家都来遵守他,这样就可以让浏览器根据标 ...

  4. transition代替简单的animation注意事项

    一. transition 和 animation  不支持    Internet Explorer 9,以及更早的版本. 二. 要变化的属性 transition-property:要变化的属性, ...

  5. css-九宫格自适应的实现

    高度自适应使用padding 或 padding-bottom + 百分比来实现: 宽度自适应使用width + 百分比来实现. 下面是实现九宫格自适应的代码: <!DOCTYPE html&g ...

  6. 关于inline-block的间隙问题

    很久之前写过一个星星评级的样式,当时开发人员在嵌套代码的时候出现很多问题,同样的一个样式有的页面正常有的页面就出现星星错位的问题,仔细研究了一下代码,发现问题原来出在了inline-block上. 目 ...

  7. css3动画（transition）属性探讨

    在webapp引用开发中经常会用到css3动画效果,下面我们就一起探讨一下这个属性的使用. 在哪里定义动画效果? css3动画一般通过鼠标事件或者说状态定义动画,通常我们可以用CSS中伪类和js中的鼠 ...

  8. 《CSS那些事儿》读书笔记

    注: 此书出版于2009年,所以有些知识...你懂得. 有些我熟悉的知识点,就没有记录下来了,所以想了解更多的细节,还是去看下此书吧. 暗灰色标记部分,是我自己的理解,有不对或要补充的地方,还请大家多 ...

  9. CSS3 Transitions

    浏览器支持 属性 浏览器 transition Internet Explorer不支持过渡属性. Firefox4需要前缀-moz-. Chrome和Safari需要前缀-webkit-. Oper ...

随机推荐

  1. 雷林鹏分享：Ruby 注释

    Ruby 注释 注释是在运行时会被忽略的 Ruby 代码内的注释行.单行注释以 # 字符开始,直到该行结束,如下所示: #!/usr/bin/ruby -w # 这是一个单行注释. puts &quo ...

  2. 16S 基础知识、分析工具和分析流程详解

    工作中有个真理:如果你连自己所做的工作的来龙去脉都讲不清楚,那你是绝对不可能把这份工作做好的. 这适用于任何行业.如果你支支吾吾,讲不清楚,那么说难听点,你在混日子,没有静下心来工作. 检验标准:随时 ...

  3. Andriod的Http请求获取Cookie信息并同步保存,使第二次不用登录也可查看个人信息

    Android使用Http请求登录,则通过登录成功获取Cookie信息并同步,可以是下一次不用登录也可以查看到个人信息, 注:如果初始化加载登录,可通过缓存Cookie信息来验证是否要加载登录界面.C ...

  4. Number Clicker CodeForces - 995E (中途相遇)

    链接 大意: 给定模数$p$, 假设当前在$x$, 则可以走到$x+1$, $x+p-1$, $x^{p-2}$ (mod p), 求任意一条从u到v不超过200步的路径 官方题解给了两个做法, 一个 ...

  5. hdu6398 计算几何

    不算严格的计算几何,就是各种分类 精度调好就能过,考虑三条边斜着放的所有情况即可 #include<bits/stdc++.h> #define LL long long #define ...

  6. python-day45--mysql索引

    一 .介绍 为何要有索引? 一些复杂的查询操作,对查询语句的优化显然是重中之重.说起加速查询,就不得不提到索引了. 什么是索引? 索引在MySQL中也叫做“键”,是存储引擎用于快速找到记录的一种数据结 ...

  7. 【转】C# 生成二维码并且在中间加Logo（图片合并）

    public class QRCodeHelper { public static Bitmap GetThumbnail(Bitmap b, int destHeight, int destWidt ...

  8. httpclient cookie保持会话

    COOKIE保持回话 httpclient4.x自带维护回话的功能,只要使用同一个httpclient且未关闭连接,就可以使用相同的回话来访问其他要求登陆验证的服务. 如果需要使用HttpClient ...

  9. Django（一）创建和启动项目

    1,使用pycharm 2,新建工程使用django框架 location 最后一个文件夹名就是project名,我用了DjangoProject. Application 是自动加入的APP名字,我 ...

  10. javascript的replace之正则表达式的浅析

    在javascript中,字符串的replace方法可以指定替换某些字符串. 1.直接替换字符串 "yy/MM/dd".replace("yy","2 ...