张艳涛写于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. What is maven？

    Introduction Maven, a Yiddish word meaning accumulator(累加器) of knowledge, began as an attempt to sim ...

  2. PTA4题学习总结

    前言: 这是我20多年以来第一次写博客了,还是在学校里那可(牛)爱(逼)的Java老师的安(逼)慰(迫)下,含泪写下第一篇博客,大家应该都明白这种含泪写下的佳(废)作(品)是多么的动人的. 就不开玩笑 ...

  3. expdp数据泵导出数据汇总

    [oracle@enmo1 ~]$ mkdir datadump[oracle@enmo1 ~]$ cd datadump/[oracle@enmo1 datadump]$ pwd/home/orac ...

  4. [Linux网络、命名空间、veth设备对、docker的host模式、container模式、none模式、brideg模式、网桥的增删查，容器与网桥的连接断开]

    [Linux网络.命名空间.veth设备对.docker的host模式.container模式.none模式.brideg模式.网桥的增删查,容器与网桥的连接断开] 网络名称空间 为了支持网络协议栈的 ...

  5. Netty 框架学习 —— 单元测试

    EmbeddedChannel 概述 ChannelHandler 是 Netty 程序的关键元素,所以彻底地测试它们应该是你的开发过程中的一个标准部分,EmbeddedChannel 是 Netty ...

  6. Linux中ls的用法

    在linux系统中,可以说一切皆文件.文件类型包含:普通文件,目录,字符设备文件,块设备文件,符号链接文件等 我们可以用file这个命令来查看文件的属性: 这里可以看到1.sh是个脚本文件 下面开始介 ...

  7. Jenkins+SonarQube实现C#代码质量检查

    环境准备 SonarQube 项目创建 jenkins Windows构建节点配置 安装与SonarQube服务端相同版本jdk 安装sonar-scanner 并配置环境变量 安装Visual St ...

  8. Spirng boot maven多模块

    https://blog.csdn.net/Ser_Bad/article/details/78433340

  9. 「CF521D」 Shop

    「CF521D」 Shop 传送门 题目说是有三种操作,首先可以知道赋值操作是可以转化为加法操作的,即 \((1,b) \rightarrow (2,b-a_i)\) 然后加法对于一个数你肯定优先选择 ...

  10. Linux账号和权限管理（第二回合）

    一.组账号文件二.添加组账号groupadd三.添加删除组成员gpasswd四.删除组账号groupdel五.查询账号信息finger六.文件/目录的权限和归属七.设置文件和目录的归属chown 一. ...