html如何设置网页的背景图片

2023-11-13

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<style type="text/css">
		*{
			padding: 0;
			margin: 0;
		}
		.big_box{
			height: 100vh;
			background: url('./three.js-dev/examples/screenshots/webgl_loader_ttf.jpg');
			background-size: 100% 100%;
		}
	</style>
	<body>
		<div class="big_box">
		
		<!-- 这里面放网页的内容 -->
		
		
		</div>
	</body>
</html>

这里说几个点,需要注意一下:
1、*{
padding: 0;
margin: 0;
}
目的是未来消除游览器默认的边距,让外边距和内边距变成0

2、height: 100vh;是div高度100vh指的是页面窗口的100%。

3、background: url(’./框架文件/three.js-dev/examples/screenshots/webgl_loader_ttf.jpg’);引号里面的是图片的路径,用相对路径或者绝对路径指到你自己搞到的背景图片。

4、background-size: 100% 100%;设置图片的大小,两个100%分别是窗口的宽高占满。如果不设置会默认图片的大小像素,如果图片大小大于窗口大小就会只显示一部分,如果图片小于窗口,会复制多张图片填满窗口。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

html如何设置网页的背景图片 的相关文章

  • 更改javascript nodejs中所有页面的href url

    我已经实现了具有多种语言下拉菜单的引导导航栏 当我选择语言时 它将翻译页面 如何更改其他页面的 url 和按钮文本 当我选择french 将所有网址更改为 fr about and fr contact 如何使用 JavaScript 进行
  • 如何保留用户的输入打印?

    我正在尝试添加用户的评论 所以我只是尝试读取输入并将其发送以进行打印 但问题是 一旦我刷新页面或输入另一个输入 打印的输入就会消失 因此 即使刷新页面或重新输入新评论 我也希望始终保持所有用户的显示 代码 div div
  • 古老的“字幕”标签的替代品?

    marquee 标签的标准等效项是什么 我正在寻找 HTML C asp NET 或 ASPX jquery java 脚本的解决方案 marquee 标签未包含在标准中 因为它是 视觉 标签 而不是 语义 标签 因此 您想要的任何语言都没
  • save_and_open_page 已停止提供我的 CSS

    我的测试设置工作得很好 每当我打电话时 都能提供正确格式的 css 页面save and open page从测试中 然后 我设置了一些 javascript 测试 并对我的设置进行了一些更改 抱歉 我无法详细说明所有内容 我没有足够详细地
  • 在 Android 上禁用标注(上下文菜单)

    在网络应用程序中 我需要禁用移动浏览器在触摸并按住 长按 触摸目标 例如 img 或链接 我已经在使用了 webkit touch callout none 它在 iPhone 和 iPad 上运行良好 但似乎不适用于 Android 在
  • 在 HTML5 Javascript 中将 BlobBuilder 转换为字符串

    function blobToString blob var reader new FileReader var d reader onloadend function d callback reader result console lo
  • VBA 完成 Internet 表单

    我正在寻找将 Excel 中的值放入网页的代码 Sub FillInternetForm Dim IE As Object Set IE CreateObject InternetExplorer Application IE naviga
  • 在 ember-cli 中安装 Foundation 5

    我对 ember 相当陌生 对构建工具也很陌生 我目前正在使用通常的基础安装以及基础 cli 和指南针来编译我的 css 这有点痛苦 并且对于团队工作来说非常糟糕 我认为用 Bower 安装文件并使用会更好ember cli compass
  • 网站在 iPhone 屏幕右侧显示空白区域

    我遇到问题http eiglaw com http eiglaw com iPhone 屏幕右侧显示约 25 像素宽的空白 边框 我在 stackoverflow 上研究了这个问题 这些帖子是相关的 但是当我尝试提供的各种解决方案时 我无法
  • Bootstrap:如何将按钮组对齐在中心(垂直)

    在下面的代码中
  • VueJS 中数据无法正确显示

    我的 VueJS 代码有一个小问题 在 输出 压缩的 GS1 数字链接 URI 部分中 When there is no result it should have nothing display like this I have remo
  • CSS 继承、别名和其他很酷的东西

    有一天 我随机浏览网页 发现了一些程序 可以让你编写 CSS 别名和其他很酷的东西 我现在不记得了 举个例子 我记得你可以这样做 myclass background color red greenfont 其中 greenfont 在其他
  • 固定 div 位于居中 div 旁边

    我有一个网页 其中有可滚动的内容 此内容包含在 content 内 位于页面的中心 现在我希望导航栏出现在内容左侧 50 像素处 该栏应具有固定位置 不应滚动 这是我到目前为止所尝试过的 nav position fixed top 50
  • 转义 h 轮廓

    因此 我一直在尝试找出在被较低级别的标题吸引后添加内容的最佳方法是什么 section h1 Title of Section h1 h2 Related 1 h2 h2 Related 2 h2 p I NEED THIS TO BE P
  • 导航栏下拉菜单(折叠)在 Bootstrap 5 中不起作用

    我在尝试使用以下命令创建响应式菜单或下拉按钮时遇到问题Bootstrap 5一切似乎都正常 导航图标和下拉图标出现 但它不起作用 当我单击nav图标或dropdown按钮 无dropdown menu apears 我想特别提到的是 我还包
  • 按下回车键时不刷新页面

    我遇到了一些问题 只要表单中有输入 回车键就会触发页面刷新 下面的代码 如果按下回车并且文本区域 input 中没有输入任何文本 则不会刷新页面 但是如果按下回车并且 input中有输入或者光标位于文本区域 我不确定是什么触发了它 因为 s
  • -webkit-box-shadow 与 QtWebKit 模糊?

    当时有什么方法可以实现 webkit box shadow 的工作模糊吗 看完这篇评论错误报告 https bugs webkit org show bug cgi id 23291 我认识到这仍然是一个问题 尽管错误报告被标记为RESOL
  • 使用 CSS 折叠和展开元素

    我正在尝试构建一个页面 加载时仅可见标题 并且 当用户单击标题时 每个标题下方的表格会在隐藏和显示状态之间切换 我的限制是只能在 CSS 中执行此操作 这是我到目前为止想到的 https jsfiddle net Argoron c1ypx
  • 主页(网格)上的缩略图现在显得模糊。如何纠正?

    我不知道这看起来是否愚蠢 但从早上开始我就无法纠正这个突然出现在我的博客网站上的错误www candidopinions in http www candidopinions in 我有一个网格视图模板 其中博客文章中的特色图像作为调整大小
  • Webpack 4:如何使用 LESS 获取 CSS 源映射?

    多年来我一直在尝试让 CSS 源映射在 webpack 中工作 但没有成功 我不确定链条中哪里出了问题 我希望有人能指出我正确的方向 这是发生的事情 行号是错误的 实际上文件名也是错误的 main less只是包含一堆 import也就是说

随机推荐

  • 域名系统几类服务器,域名系统

    域名系统 编辑 定义 域名系统 简称为DNS Domain Name System 是因特网使用的命名系统 用来便于人们使用的机器名字转换为IP地址 域名系统其实也称为名字系统 只是更明确地指明这种系统是用在因特网中 域名系统的主要特点是在
  • HTTP请求接口方法(POST/GET)

    private static string HttpPost string Url string postDataStr HttpWebRequest request HttpWebRequest WebRequest Create Url
  • 【Python】matplotlib画散点图,并根据目标列的类别来设置颜色区间(含源代码及参数解释)

    最近在进行绘图时 遇到了matplotlib画散点图 并根据目标列的类别来设置颜色区间的问题 但是实现的过程较为艰辛 文章目录 一 数据准备 二 第一次尝试 失败及其原因 2 1 失败 2 2 原因 三 第二次尝试 成功 四 总结 plt
  • Nginx 重写功能(location / rewrite)

    这里写自定义目录标题 一 nginx rewrite概述 1 概述 2 Rewrite跳转场景 3 Rewrite跳转实现 4 Rewrite实际场景 二 Nginx常见模块 三 常见的Nginx正则表达式 1 正则的优势 2 正则的作用
  • shell 多个引号冲突_请教Linux shell命令中双引号与单引号嵌套的问题

    addr 192 168 0 111 echo addr 结果为 192 168 0 111 echo addr 结果为 addr 这两个我还可以理解 1 双引号内的单引号功能被关闭 反之亦然 2 双引号内的 功能被保留 单引号 addr
  • fatal: Authentication failed for ‘https://github.com

    记录在本地电脑建立与GitHub连接时遇到的错误 附上解决方案 git clone 遇到的错误 remote Support for password authentication was removed on August 13 2021
  • osx 常用defaults命令

    defaults命令用来对mac os x系统进行某些设置 常用命令 查看所使用的defaults命令 history grep defaults 分类查看defaults命令 history grep defaults write his
  • JavaScript数据结构——字典(Dictionary)

    概念和结构 字典里面的元素都是一个键 key 值 value 对 字典里面的元素的键 key 不能重复 值 value 可以重复 字典的操作 字典有八种常用操作 分别为 检查键是否存在 has key 添加元素 set key value
  • js 搜索模糊匹配

    searchvalue list keyWord if keyWord var reg new RegExp keyWord var arr for var i 0 i lt list length i if reg test list i
  • Java8-对List转换Map、分组、求和、过滤

    前言 在java8之后我们list转map再也不用循环put到map了 我们用lambda表达式 使用stream可以一行代码解决 下面我来简单介绍list转map的几种方式 和转为map后对map进行分组 求和 过滤等操作 正文 数据准备
  • C#实现百度地图附近搜索&调用JavaScript函数

    前一篇文章 C 调用百度地图API入门 解决BMap未定义问题 讲述了如何通过C 调用百度API显示地图 并且如何解决BMap未定义的问题 这篇文章主要更加详细的介绍百度地图的一些功能 包括附近搜索 城市搜索 路线规划 添加覆盖物等等 希望
  • ipv6的链路本地地址

    目录 简介 先决条件 要求 使用的组件 规则 配置 网络图 配置 验证 检验 OSPF 的配置 正在验证的链路本地地址可接通性 ping从远程网络的链路本地地址 直接ping从连接的网络的链路本地地址 相关信息 简介 本文目的将提供对在网络
  • Qt漂亮界面

    Qt漂亮界面 功能规划 一 去掉菜单栏和工具栏 二 顶部导航栏的设计 appinit h头文件 appinit cpp的文件 使用方式 三 阵列按钮的点击事件写法 四 重写缩写界面 放大界面和关闭程序事件 五 鼠标事件的处理 Qt大量同类控
  • mysql数据库内容导出,MySql数据库导出

    Navicat Premium Data Transfer Source Server 刘文鹏 Source Server Type MySQL Source Server Version 50540 Source Host 127 0 0
  • 关于X79主板至强E5 CPU安装ArchLinux的记录

    最近想在家里搭网站 打算弄两台服务器 一个是旧机器x79主板的 作为AI绘图和Chatglm部署用 一个新买的是带有N5095的小板子 装了CentOS7来当web服务器 当作前置服务器 主要为外网提供服务 装CentOS7比较简单容易 所
  • TransFusion:利用 Transformer 进行鲁棒性融合来进行 3D 目标检测

    Query 初始化 Input dependent 以往 Query 位置是随机生成或学习作为网络参数的 而与输入数据无关 因此需要额外的阶段 解码器层 来学习模型向真实对象中心移动的过程 论文提出了一种基于center heatmap 的
  • VC6.0使用教程

    使用之前我们先准备一段代码 include
  • C#将依赖的DLL文件集成到EXE内部

    使用场景 C 写的一些小程序 为了方便传播 减少传播文件数量 将依赖的DLL文件集成到EXE内部是必要的 解决方案 打开 管理NuGet程序包 在浏览中搜索 Costura Fody 点击 安装 按钮 等待下载依赖及安装完成 重新编译软件
  • 操作系统7-信号量与管程

    回顾一下 并发问题 多线程并发导致资源竞争 同步概念 1 协调多线程对共享数据的访问 2 任何时刻只能由一个线程执行临界区代码 确保同步正确的方法 底层硬件支持 高层次的编程抽象 锁 信号量是锁机制在同一层上的高层抽象编程方法 一 信号量s
  • html如何设置网页的背景图片

    div div