HTML 背景图片自适应
CSS
body.loginpage {
background-image: url(../images/background-image.jpg);
background-size:cover;
}
HTML
<body class="loginpage">
<div class="loginpanel">
<div class="loginpanelinner">
<div class="logo animate0 bounceIn">
<img src="UI/main.shamcey/images/logo.png" alt="" />
</div>
<div class="inputwrapper login-alert">
<div class="alert alert-error">Invalid username or password</div>
</div>
<div class="inputwrapper animate1 bounceIn">
<input type="text" name="username" id="username" placeholder="Enter any username" />
</div>
<div class="inputwrapper animate2 bounceIn">
<input type="password" name="password" id="password" placeholder="Enter any password" />
</div>
<div class="inputwrapper animate3 bounceIn">
<button id="submit" name="submit">Sign In</button>
</div>
<div class="inputwrapper animate4 bounceIn">
<label>
<input type="checkbox" class="remember" name="signin" />
Keep me sign in
</label>
</div>
</div>
</div>
<div class="loginfooter">
<p>© 2013. Shamcey Admin Template. All Rights Reserved.</p>
</div>
</body>
HTML 背景图片自适应的更多相关文章
- 【Python全栈-CSS】CSS实现网页背景图片自适应全屏
CSS实现网页背景图片自适应全屏 功能:实现能自适应屏幕大小又不会变形的背景大图,而且背景图片不会随着滚动条滚动而滚动. 以下是用CSS实现的方法: <html> <head> ...
- 基于html5背景图片自适应代码
基于html5背景图片自适应代码是一款背景不随滚动条滚动,会根据分辨率不同自动匹配对应的背景图片.效果图如下: 在线预览 源码下载 实现的代码. css代码: .jawbone-hero .jaw ...
- bootstrop设置背景图片自适应屏幕
如果不用bootstrop框架,想让背景图片自适应窗口大小,可以这样做: <style type="text/css"> html{height: %;} body.a ...
- CSS实现网页背景图片自适应全屏
一张清晰漂亮的背景图片能给网页加分不少,设计师也经常会给页面的背景使用大图,我们既不想图片因为不同分辨率图片变形,也不希望当在大屏的情况下,背景有一块露白,简而言之,就是实现能自适应屏幕大小又不会变形 ...
- css设置背景图片自适应
CreateTime--2017年12月25日16:36:07 Author:Marydon 控制背景图片100%自适应填充布局 /* 控制背景图片100%自适应填充布局 */ body{ bac ...
- CSS实现网页背景图片自适应全屏,自适应背景图片
一张清晰漂亮的背景图片能给网页加分不少,设计师也经常会给页面的背景使用大图,我们既不想图片因为不同分辨率图片变形,也不希望当在大屏的情况下,背景有一块露白,简而言之,就是实现能自适应屏幕大小又不会变形 ...
- css 背景图片自适应元素大小
一.一种比较土的方法,<img>置于底层. 方法如下: CSS代码: HTML: <img src="背景图片路径" /> <span>字在背景 ...
- 背景图片自适应整个页面CSS+DIV
<body style="overflow:hidden;"> <div class="wrapper"> <!--背景图片--& ...
- div背景图片自适应
对背景图片设置属性:background-size:cover;可以实现背景图片适应div的大小. background-size有3个属性: auto:当使用该属性的时候,背景图片将保持100% 的 ...
- H5 背景图片自适应屏幕问题解决办法
今天也是偶然遇到这个问题的,平成很少用到关于css的内容,就在网上找了很多个方法,最后总结以下几种很实用的方法 方法1: <style> body{ background:url(beij ...
随机推荐
- linux云计算集群架构学习笔记:命令查看文件内容
查看文件内容 1.cat 命令 作用:查看文件内容 语法:cat 文件名 2. more 命令 作用:分页查看文件内容 语法:more 文件名 例:more /etc/passwd 按下回车刷新一行 ...
- [改善Java代码]小心switch带来的空值异常
使用枚举定义常量时,会伴有大量的switch语句判断,目的是伪类每个枚举项解释其行为,例如: public class Client { public static void main(String[ ...
- hdu 4638 树状数组
思路:将查询区间按右节点的升序排列,然后插入第i个数的时候,若nun[i]+1已经插入,那么就update(pre[num[i]+1],-1):pre[]表示的是该数的位置.同样若 num[i]-1存 ...
- oracle 9i 中行转列
示例如下: SELECT deptno , LTRIM(MAX(SYS_CONNECT_BY_PATH(ename,',')) KEEP (DENSE_RANK LAST ORDER BY curr) ...
- Quartz Scheduler(2.2.1) - Usage of CronTriggers
Cron is a UNIX tool that has been around for a long time, so its scheduling capabilities are powerfu ...
- Git CMD - config: Get and set repository or global options
命令参数 --get 获取指定的配置项. --global 对于写选项:全局配置,将参数配置于 ~/.gitconfig 而不是仓库目录下的 .git/config.对于读选项:只从 ~/.gitco ...
- MD5和Base64介绍与应用
MD5:概念:MD5是一种不可逆的消息摘要算法.为计算机安全领域广泛使⽤的一种散列函数, 用以提供消息的完整性保护.效果:把一个任意长度的字节串变换成⼀定⻓度的⼗六进制数字串. 目的是让⼤容量信息在⽤ ...
- KVC/KVO总结
KVC(键值编码) 动态设置: setValue:属性值 forKey:属性名(用于简单路径) setValue:属性值 forKeyPath:属(用于复合路径,例如Person有一个Account类 ...
- MSSQL 数字钱转化为大写
--说明: --1.本函数范围从 毫 ~ 兆 --2.有四种精度(元,角 ,分,厘 ,毫) --3.有三种进位规则(四舍五入,接舍去,非0就入) --参数说明:dbo.MoneyToCapital( ...
- 引用类型之Function类型
Function类型 ECMAScript中最有意思的就是函数了,有意思的根源,在于函数实际上是对象.每个函数都是Function的实例,具有属性和方法.而重要的一点是,函数名,不过是指向函数的指针, ...