张艳涛写于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. 惊呆了，Spring Boot居然这么耗内存！

    Spring Boot总体来说,搭建还是比较容易的,特别是Spring Cloud全家桶,简称亲民微服务,但在发展趋势中,容器化技术已经成熟,面对巨耗内存的Spring Boot,小公司表示用不起.如 ...

  2. Pytorch项目基本结构

    梳理一下Pytorch项目的基本结构(其实TF的也差不多是这样,这种思路可以迁移到别的深度学习框架中) 结构树 -------checkpoints #存放训练完成的模型文件 ​ ----xxx.pk ...

  3. github push pull error port 443: Timed out

    最近github只有开代理才能打开,但是即使能打开,进行push或者pull会经常报类似error port 443: Timed out的错误,网上搜了很久才找到解决办法. 首先要查询当前本机使用的 ...

  4. Python UI自动化

    Python3--Uiautomator2--Pytest--Alure使用 官方源码GitHub地址:https://github.com/openatx/uiautomator2 介绍 uiaut ...

  5. 基于C#的socket编程的TCP同步实现

    该博客源著地址https://www.cnblogs.com/sunev/archive/2012/08/05/2604189.html 一.摘要 总结一下基于C#的TCP传输协议的涉及到的常用方法及 ...

  6. 7、openstack安装

    1.openstack配置架构图: 2.主机设置: (1)两台主机名分别是controller和compute1: hostnamectl set-hostname controller hostna ...

  7. Samba常见漏洞利用

    Samba简介 Samba是linux和unix系统上实现smb协议的一个免费软件,由服务器及客户端程序构成,Samba是面向Linux和Unix环境的Windows互操作性套件.它适用于在可能包括L ...

  8. HDU 4821 2013长春现场赛hash

    题意: 一个字符串S  问其中有几个子串能满足以下条件: 1.长度为M*L 2.可以被分成M个L长的小串  每个串都不一样 分析: hash方法,一个种子base,打表出nbase[i]表示base的 ...

  9. HDU 4438 Hunters 区域赛水题

    本文转载于 http://blog.csdn.net/major_zhang/article/details/52197538 2012天津区域赛最水之题: 题意容易读懂,然后就是分情况求出A得分的数 ...

  10. 【重学Java】可变参数

    可变参数 可变参数[应用] 可变参数介绍 可变参数又称参数个数可变,用作方法的形参出现,那么方法参数个数就是可变的了 方法的参数类型已经确定,个数不确定,我们可以使用可变参数 可变参数定义格式 修饰符 ...