张艳涛写于2021-1-20日

What: 如何让button的长度和input长度一致呢

最先想到的是给这个button加一个class ="buttonclass",然后在vue最后的<style标签中>设置

.buttonclass {
width : 100%;
}

这个前两篇设置height为100%的方法是一致的.

还有一个更简单的方法就是内联式css

<el-form-item><el-button > 登录 </el-button></el-form-item>

并且css样式代码要写在style=""双引号中,如果有多条css样式代码设置可以写在一起,中间用分号隔开。如下代码:

<p style="color:red;font-size:12px">这里文字是红色。</p>
三种插入样式的优先级:

三种插入样式优先级从高到底为:内联式>嵌入式>外部式
其中嵌入式>外部式的条件为:嵌入式CSS的位置在外部式的后面
可以理解为:就近原则--离被设置元素越近优先级别越高

构建前端第6篇之---内嵌css样式 <el-button style="width:100%"> 登录 </el-button>的更多相关文章

  1. div style标签内嵌CSS样式

    我们在DIV标签内.SPAN标签内.p标签等html标签内使用style属性直接设置div的样式. 一.在<div>标签内使用style设置css样式   -   TOP 1.实例html ...

  2. Spring Boot 揭秘与实战(五) 服务器篇 - 其他内嵌服务器 发表于 2017-01-03 | Spring框架 | Spri

    文章目录 1. Jetty 的切换 2. Undertow的使用 Spring Boot 可选择内嵌 Tomcat.Jetty 和 Undertow,因此我们不需要以 war 包形式部署项目.< ...

  3. 『Asp.Net 组件』Asp.Net 服务器组件 内嵌CSS:将CSS封装到程序集中

    代码: <span style="font-family:Microsoft YaHei; font-size:12px">using System; using Sy ...

  4. [Web 前端] 031 bootstrap 的使用和全局 css 样式

    目录 0. 前言 1. 基本模板 2. 布局容器 2.1 container 2.2 container-fluid 3. 栅格系统 3.1 简介 3.2 栅格参数 3.3 实例:从堆叠到水平排列 2 ...

  5. 构建前端第12篇之---在Vue中对组件,变量,函数的全局引入

    张燕涛写于2020-01-16 星期two 本篇还是源于import和export的使用,昨天看es6入门 和MDN文档,大体上用法了解了,但今天看ElementUI源码的时候,看到 //src/in ...

  6. 构建前端第7篇之---elementUI设置主题,进而改变全局button底色

    张艳涛写于2020-1-20 What:是elementUI主题? 是内置的格式,elementUI默认只有一个主题,如果想整体替换按钮的颜色等问题,那么就可以用主题 设置步骤 在路径src/styl ...

  7. 构建前端第2篇之--ESLint 配置

    张艳涛 写于2021-1-19 报错: http://eslint.org/docs/rules/space-before-function-paren Missing space before fu ...

  8. 构建前端第13篇之---VUE的method:{}的括号未括到方法导致 _vm.linkProps is not a function

  9. 构建前端第10篇之---Function.prototype.call()

    张艳涛写于2020-01-25,参考:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/ ...

随机推荐

  1. YoyoGo v1.7.2 发布, 支持 Nacos & Apollo 配置中心

    YoyoGo (Go语言框架)一个简单.轻量.快速.基于依赖注入的微服务框架( web .grpc ),支持Nacos/Consoul/Etcd/Eureka/k8s /Apollo等 . https ...

  2. 认识5G

    认识5G 一  移动通信发展历程 1移动通信技术具有代际演进规律 "G"代表一切 每10年一个周期 二  5G技术指标 流量密度:单位面积内的总流量数,是衡量移动网络在一定区域范围 ...

  3. git stash回退

    目录 1.起因 2. 问题出现 3.修复 4. 注意 1.起因 这个问题要从今天刚遇到的事儿说起,昨晚代码出了个乌龙事件,本来正在dev分支进行新功能的开发,但是测试出现的问题是在release 分支 ...

  4. SSM动态展示分页

    这个作业属于哪个课程 2021春软件工程实践|S班(福州大学) 这个作业要求在哪里 作业具体要求 这个作业的目标 个人技术 参考文献 ... 目录 技术概述 技术详述 问题和解决过程 总结 参考文献 ...

  5. OSPF路由协议

    一.OSPF的工作过程 二.OSPF的基本概念 三.DR与BDR 四.OSPF数据包类型 五.OSPF邻接关系的建立 六.OSPF的路由器类型 一.OSPF的工作过程 OSPF路由协议针对每一个区域分 ...

  6. external-provisioner源码分析(3)-组件启动参数分析

    更多ceph-csi其他源码分析,请查看下面这篇博文:kubernetes ceph-csi分析目录导航 external-provisioner源码分析(3)-组件启动参数分析 本文将对extern ...

  7. 计算机、程序和java简介

    内存 计算机的内存是由一个有序的字节序列组成,用于存储程序及程序需要的数据.你可以将内存想象成计算机执行程序的工作区域.一个程序和它的数据在被CPU执行前必须移到计算机的内存中. 每个字节都是有一个唯 ...

  8. Mysql Limit 调优

    建表与插入数据 SQL对比 基本数据 创建表 CREATE TABLE student ( id int(10) NOT NULL AUTO_INCREMENT, name varchar(25) D ...

  9. redis为什么那么快?

    数据库有很多,为什么Redis能有如此突出的表现呢?一方面,因为它是内存数据库,所有操作都在内存上完成.另外一方面就要归功于他的数据结构.高效的数据结构是Redis快速处理的基础.今天我们就来聊聊了R ...

  10. Acunetix敏感的数据泄露–泄露如何发生

    术语"敏感数据暴露"是指允许未授权方访问存储或传输的敏感信息,例如信用卡号或密码.全球范围内大多数重大安全漏洞都会导致某种敏感的数据泄露. Acunetix利用攻击漏洞(例如Web ...