全屏显示一张图片,不显示滚动条

简介:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="css/css.css" />
<title>niday</title>
</head>
<body>
<div class="bg">
<div class="left">
<img src="img/10.jpg" />
</div>
</div>
</body>

</html>



html,body,.bg{                                             //此处一定要加HTML,不加会出现下底白边
margin: 0px;
    padding: 0px;
    width: 100%;
    height: 100%;
}
.left{
height: 100%;
    width: 100%;
    overflow: hidden;
    position: relative;
    
}
.bg .left img{
width: 100%;
height:100%;
}





接下来看看CSS不加HTML元素的,出现下底白边:







常见工作站:



<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<link rel="stylesheet" href="css/css.css" />

<title>niday</title>

</head>

<body>

<div class="bg">

<div class="left">

<img src="img/10.jpg" />

</div>

</div>

</body>

 

</html>

 CSS:

html,body,.bg{   

margin: 0px;

    padding: 0px;

    width: 100%;

    height: 100%;

}

.left{

height: 100%;

    width: 50%;

    overflow: hidden;

    position: relative;

    

}

.bg .left img{

width: 100%;

height:100%;

}

 

 

如果CSS不写还HTML,出现白边:



目录
相关文章
|
SQL 存储 druid
Minerva -- Airbnb 的大规模数据指标系统 Part 3
Minerva -- Airbnb 的大规模数据指标系统 Part 3
723 0
Minerva -- Airbnb 的大规模数据指标系统 Part 3
|
数据格式
Front Immunol 复现 | 4. 使用estimate包评估肿瘤纯度
Front Immunol 复现 | 4. 使用estimate包评估肿瘤纯度
935 0
Front Immunol 复现 | 4. 使用estimate包评估肿瘤纯度
|
运维 应用服务中间件 Windows
如何重置云服务器系统
在这之前已经给大家讲了 服务器的作用有哪些,此文带你来了解 远程连接Windows服务器 在这次购买服务器的过程中,遇到这样一件事,就是如何重置云服务器系统
2357 0
如何重置云服务器系统
|
移动开发 算法
科学计算与仿真-高斯牛顿法的非线性最小二乘问题简单介绍与应用
科学计算与仿真-高斯牛顿法的非线性最小二乘问题简单介绍与应用
科学计算与仿真-高斯牛顿法的非线性最小二乘问题简单介绍与应用
|
Java 数据库连接 数据格式
【Java笔记+踩坑】Spring基础2——IOC,DI注解开发、整合Mybatis,Junit
IOC/DI配置管理DruidDataSource和properties、核心容器的创建、获取bean的方式、spring注解开发、注解开发管理第三方bean、Spring整合Mybatis和Junit
【Java笔记+踩坑】Spring基础2——IOC,DI注解开发、整合Mybatis,Junit
|
弹性计算 安全 网络安全
点点鼠标轻松开通个人网站 阿里云99计划保姆级教程
许多电脑爱好者有创办个人博客的想法,小微企业也有办设电商网站的意愿。这个事说难不难,但对于没有经验的新手来说确实比较麻烦,服务器配置、系统配置、建站发布千头万绪。网上的确能搜到各种各样的教程,但很多教程还是有一定的操作门槛,比如要输入一大堆命令。新手因为不理解命令的含义,容易在半路出现卡壳。
363 0
|
SQL 安全 PHP
DVWA File Inclusion 通关解析
DVWA File Inclusion 通关解析
|
人工智能 自然语言处理 API
云栖发布:通义听悟AI能力再进化,开放API接口
云栖发布:通义听悟AI能力再进化,开放API接口
|
编解码 Linux 开发工具
大牛直播SDK跨平台RTMP直播推送模块技术设计和功能列表
大牛直播SDK是一款跨平台RTMP直播推送模块,支持Windows、Linux(x64_64与aarch64架构)、Android及iOS平台。该SDK功能全面,包括摄像头、屏幕、麦克风等数据采集与推送,并支持编码前后数据对接。其架构设计优秀,确保低延迟与高效率,结合SmartPlayer播放器实现毫秒级延迟体验。具备全自研框架,易于扩展且支持多种数据源接入,如外部YUV/RGB/H.264等格式。此外,各平台支持特性丰富,如Windows平台支持多摄像头合成,Android与iOS平台支持前后摄像头实时切换等。大牛直播SDK还提供了多个示例项目以帮助开发者快速上手。
405 0
|
JavaScript
vue实现点击按钮将指定文字复制到系统剪切板并提示复制成功
vue实现点击按钮将指定文字复制到系统剪切板并提示复制成功
124 0