bootstrop设置背景图片自适应屏幕
如果不用bootstrop框架,想让背景图片自适应窗口大小,可以这样做:
<style type="text/css">
html{height: %;}
body.aa{height: auto;
background: url(login-background.png) no-repeat center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
color: rgba(, , , .)}
</style>
bootstrop中
css中编辑此样式:
.bg {
background:url(图片地址) no-repeat center;
background-size:contain;
}
然后在你的div里引用这个样式就行了:
<div class="row bg">
使图片不随滚动条滚动,即固定不动则加fixd:
.bg {
background:url(图片地址) no-repeat center fixed;
background-size:contain;
}
bootstrop设置背景图片自适应屏幕的更多相关文章
- css设置背景图片自适应
CreateTime--2017年12月25日16:36:07 Author:Marydon 控制背景图片100%自适应填充布局 /* 控制背景图片100%自适应填充布局 */ body{ bac ...
- H5 背景图片自适应屏幕问题解决办法
今天也是偶然遇到这个问题的,平成很少用到关于css的内容,就在网上找了很多个方法,最后总结以下几种很实用的方法 方法1: <style> body{ background:url(beij ...
- css -- 背景图片自适应屏幕大小
由于<body>标签的图片不能够拉伸, 解决办法: 1.图片不够大,又background属性不能拉伸图片: 2.只能用个div,把其z-index值设为负,并使这个div大小为整个bod ...
- css中设置背景图片适应屏幕
以body为例 body{ background: url(../img/jld.png) no-repeat center center fixed; -webkit-background-size ...
- background-size (设置背景图片的大小)
设置背景图片的大小,以长度值或百分比显示(数值包括 长度length和百分比percentage),还可以通过cover和contain来对图片进行伸缩. 语法:background-size: au ...
- 【Python全栈-CSS】CSS实现网页背景图片自适应全屏
CSS实现网页背景图片自适应全屏 功能:实现能自适应屏幕大小又不会变形的背景大图,而且背景图片不会随着滚动条滚动而滚动. 以下是用CSS实现的方法: <html> <head> ...
- 小程序通过background-image设置背景图片
微信小程序通过background-image设置背景:只支持线上图片和base64图片,不支持本地图片:base64图片设置步骤如下: 1.在网站http://imgbase64.duoshiton ...
- 微信小程序通过background-image设置背景图片
微信小程序通过background-image设置背景:只支持线上图片和base64图片,不支持本地图片:base64图片设置步骤如下:1.在网站http://imgbase64.duoshitong ...
- img只显示图片一部分 或 css设置背景图片只显示图片指定区域
17:14 2016/3/22img只显示图片一部分 或 css设置背景图片只显示图片指定区域 background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左 ...
随机推荐
- Mac OS修改VSCode Go的默认缩进格式
一.在VSCode中编写Go代码时,缩进是使用tab缩进,主要是由于以下两个方面. 1. Go官方提供的代码格式化工具gofmt默认是使用tab缩进,并且为8个字符宽度. 2. 并且在VSCode中, ...
- Python——五分钟理解函数式编程与闭包
本文始发于个人公众号:TechFlow,原创不易,求个关注 今天是Python专题的第9篇文章,我们来聊聊Python的函数式编程与闭包. 函数式编程 函数式编程这个概念我们可能或多或少都听说过,刚听 ...
- 利用Python批量重命名文件夹下文件
#!/usr/bin/python # -*- coding: UTF-8 -*- # -*- coding:utf8 -*- import os from string import digits ...
- 金三银四科学找工作,用python大数据分析一线城市1000多份岗位招聘需求
文章每周持续更新,各位的「三连」是对我最大的肯定.可以微信搜索公众号「 后端技术学堂 」第一时间阅读(一般比博客早更新一到两篇) 每年的三四月份是招聘高峰,也常被大家称为金三银四黄金招聘期,这时候上一 ...
- 在操作Git Bash时出现的问题
参考博客:https://blog.csdn.net/weixin_44394753/article/details/91410463 1.问题1 $ git remote add origin gi ...
- 这些基本的 HTML5 标签你不能不知道
HTML5元素 HTML5是HTML最新的修订版本,2014年10月由万维网联盟(W3C)完成标准制定. HTML5是用来写网页的一门标记语言. 使用的时候需要在首行声明HTML,如:<!DOC ...
- 过滤器filter学习进度一
过滤器filter他的理解是: filter是对客户端访问资源的过滤,符合条件放行,不符合条件的不放行,并且可以对目标资源访问的前后进行逻辑处理. 快速入门: 1.编写一个过滤器的类实现filter接 ...
- javascript 入门 之 bootstrap/bootstrap-table 安装方法
也和select2一样,可以有三种方法 1.远程调用CDN 2.用bower安装 3.下载 时间原因,暂时先讲第二种,其余两种,以后完善 1.进入根目录,执行bower install bootstr ...
- Swing组件中URL方法获取 图标
13.3.2 图标的使用 1.创建图标 package lll; import java.awt.*; import javax.swing.*; public class DrawIcon impl ...
- .net core 对dapper 新增 更新 删除 查询 的扩展
早期的版本一直用的是EF,但是EF一直有个让人很不爽的东西需要mapping 实体对象:如果没有映射的情况下连查询都没办法: 所以后来开始使用dapper 但是dapper都是直接用的是sql,这个对 ...