一切福田，不離方寸，從心而覓，感無不通。

Daily Archives: 2020年2月14日

Vue项目静态文件之图片的引用

一、前提 工程文件目录 |- mock |- node_modules |- public |- src |-- api |-- assets |-- components |-- router |-- store |-- style |-- test1.scss |-- test1_main.scss |-- utils |-- views |-- static_test |-- test1.scss |-- App.vue |-- main.js 二、背景图的引用 背景图样式直接写在element的style属性里 直接在html模板里，在dom对象的style里加背景图，不起效果，代码如下：

1
2
3
<div style="height:100px; background:url('../../assets/img/bg.png') center top no-repeat">
不起效果。。。
</div>

  背景样式class写在vue文件的style标签里 写法： background: url('图片相对当前的路径') center top no-repeat

1
2
3
4
5
6
7
8
<el-card class="box-card sudoku_item">
  <div slot="header" class="clearfix">
    <span>背景图写在css里</span>
  </div>
  <div class='testBackground'>
    起效果。。。
  </div>
</el-card>

 

1
2
3
4
5
6
<style lang="scss" scoped>
  .testBackground {
    height: 100px;
    background: url('../../assets/img/bg.png') center top no-repeat
  }
</style>

  编译后的css：

1
2
3
4
.testBackground[data-v-eb2b930e] {
    height: 100px;
    background: url(../img/bg.187d48cd.png) top no-repeat;
}

  背景样式class写在样式文件里，在vue文件里引入样式文件 样式写法：

1
background: url('图片相对当前vue文件的路径') center top no-repeat

  这个图片路径很重要，url是图片相对于当前vue文件的路径，而不是图片相对于样式文件的路径。 html写法， /views/static_test/test1.vue:

1
2
3
4
5
6
7
8
  <el-card class="box-card sudoku_item">
    <div slot="header" class="clearfix">
      <span>背景图写在style file里</span>
    </div>
    <div class='testBackground_file'>
      起效果。。。
    </div>
  </el-card>

  样式写法， /style/test1.scss：

1
2
3
4
  .testBackground_file {
    height: 100px;
    background: url('../../assets/img/bg.png') center top no-repeat
  }

  /views/static_test/test1.vue，引入样式文件写法：

1
2
3
  <style lang="scss" scoped>
  @import "../../style/test1.scss";
  </style>

  编译后：

1
2
3
4
.testBackground_file[data-v-eb2b930e] {
    height: 100px;
    background: url(../img/bg.187d48cd.png) top no-repeat;
}

  背景样式class写在样式文件里，在main.js里引入样式文件 html写法， /views/static_test/test1.vue:

1
2
3
4
5
6
7
8
  <el-card class="box-card sudoku_item">
    <div slot="header" class="clearfix">
      <span>背景图写在style file里</span>
    </div>
    <div class='testBackground_file_main'>
      起效果。。。
    </div>
  </el-card>

  样式写法, /style/test1_main.scss：

1
2
3
4
  .testBackground_file_main {
    height: 100px;
    background: url('../assets/img/bg.png') center top no-repeat
  }

  请注意，url是main.js相对于图片文件的路径。 引入样式文件方法，main.js：

1
2
// style
import './style/test1_main.scss'

[…]

龙生   14 Feb 2020
View Details

css3 字体自动换行第二行缩进一格

我们知道css中text-indent属性可以使每个段落首行开头文字缩进，如缩进2个文字距离样式。 p{ 　　text-indent: 2em; /*em是相对单位*/ } 注：em是相对长度单位。相对于当前对象内文本的字体尺寸。我们中文段落一般每段前空两个汉字。实际上，就是首行缩进了2em。 那如果我们想让第二行缩进一格呢： p { text-indent: -2em; margin-left: 2em; } 设置text-indent: -2em;以后p标签中第一行文字向左偏移，这样第二行开始的文字就等于缩进了， 但是这样设置会导致第一行向左超出div，所以再用margin-left使p标签整体右移即可， 不过也可以用 padding-left:2em ，这样IE8里也能显示。   from:https://www.cnblogs.com/lvyeconghua/p/9375817.html

龙生   14 Feb 2020
View Details

CentOS 7 最小化安装的无线网络配置

1.首先下载iw工具。 yum -y install iw 2.获取无线网卡的名称 执行iw dev，假设获得名称为 wlp3s0（示例） 3.激活无线网络接口 执行ip link set wlp3s0 up 4.扫描当前环境中的无线网络 执行iw wlp3s0 scan|grep SSID，假设你能够连接的网络名称是TP-LINK-1（示例） 5.登录指定网络 执行wpa_supplicant -B -i wlp3s0 -c <(wpa_passphrase "TP-LINK-1" "此网络的密码") 6.主动请求动态地址 dhclient wlp3s0 7.查看获取的网络地址 执行ip addr show wlp3s0 上善若水，水利万物而不争。 from:https://www.cnblogs.com/yoyotl/p/6090721.html

龙生   14 Feb 2020
View Details

linux下移植wifi之安装iw and iw操作(五)

第四节 安装iw and iw操作 一、 先查看README，获取了三个有用点： 1.    This is 'iw', a tool to use nl80211（iw需要nl80211） 2.  To build iw, just enter 'make'. If that fails, set the PKG_CONFIG_PATH environment variable to allow the Makefile to find libnl.(通过这个参数来指定libnl库的位置) 3.  'iw' is currently maintained at http://git.sipsolutions.net/iw.git/,(iw软件下载网站) 4.  some more documentation is available at http://wireless.kernel.org/en/users/Documentation/iw. (iw 操作说明文档) 解压：tar -xf /mnt/hgfs/linux_share/0711/iw-4.9.tar.xz nl80211已经安装了，通过PKG_CONFIG_PATH变量，我们已经指定了nl80211头文件和库的路径，可以通过命令进行查看。 命令：echo $PKG_CONFIG_PATH 得：/home/clh/work/libnl-3.2.25/tmp/lib/pkgconfig: 二、编译 在info.c的代码前面添加 #define htole16(X)  (((((uint16_t)(X)) << 8) | ((uint16_t)(X) >> 8)) & 0xffff) 修改Makefile ，加上libnl的头文件 和 lib库。 CFLAGS += -I/home/clh/work/libnl-3.2.25/tmp/include/libnl3 LDFLAGS += -L/home/clh/work/libnl-3.2.25/tmp/lib make CC=arm-linux-gcc make DESTDIR=$PWD/tmp […]

龙生   14 Feb 2020
View Details

centos7 与windows10之间的开机引导

一、centos7下引导windows10 当在win10系统下安装centos7系统后进入centos系统需要引导windows10开机启动项。 1、打开terminal，输入命令vi /boot/grub2/grub2.cfg 编辑开机引导文件。 2、在 70 行左右的 ### END /etc/grub.d/00 header 和 ### BEGIN /etc/grub.d/10_linux ### 间添加 menuentry ‘Windows10’{ set root = (hd0,1) chainloader +1 } 表示 Windows7 的引导设备为第 1块磁盘的第 1 个分区，根据实际情况填，如果不知道输入命令lsblk查看，或者试几次，如果不正确的话开机选择win10后会报错。 4、重启reboot，即可看到开机引导项。 二、windows10下引导linux 当在centos7系统下安装win10系统后进入win10系统需要引导centos开机启动项。 1、下载并安装EasyBCD开机引导软件，软件很小，功能很强大。如果懒得 百度下，附上百度云下载链接https://pan.baidu.com/s/1-yF3s1fmumnE06_NV2rUYg 2、打开easybcd，点击添加新条目，选择linux，类型选择GRUN2，名称随便写，就是你开机引导显示的名称，然后点击驱动器选择你linux安装的分区，如果不知道，方法同上可以多试几次，点击添加条目，即可添加成功。 centos7 与windows10之间的开机引导 3、最重要的一点，添加成功后点击编辑引导菜单选择倒计时那一项然后点击保存设置，时间自己定，我上次就是没看自动选择的跳过菜单而导致重启n次也显示不出启动项。   from:https://blog.csdn.net/qq_37671523/article/details/102161216

龙生   14 Feb 2020
View Details

Copyright © 2025 Longsheng All rights reserved