首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

HTML中背景的设置

, 17 2月 2021 作者 847954981@qq.com 前端学习, 我的编程之路 HTML中背景的设置 在之前的HTML学习中我们知道了,对于背景颜色,我们可以使用 background-color...当然这种只是最基础的颜色渐变,更为复杂的颜色渐变请参考 |MDN的CSS渐变指南| 背景图片 在设置背景的时候,我们不可不免也需要使用图片作为背景。...当图片大小不足以囊括整个页面时,HTML默认多次复制图片来填充页面,但如果使用 background-repeat: no-repeat;则不会存在重复图片。...左上角是 0 0,单位是像素 (0px 0px) 或任何其他的 CSS 单位。...contain 把图像图像扩展至最大尺寸,以使其宽度和高度完全适应内容区域 xpx ypx 自定义设置高度和宽度 x% y% 相对于容器百分比设置高度、宽度 background 存在简便写法 background

5.4K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    像素相关概念:PPI、DPI、设备像素、独立像素

    然后根据上面的公式得出: 总设备像素 = 总 css 像素 2 = 375 667 2 。然而实际上总的设备像素是 750 x 1334 个像素点。...其实 DPR = 设备像素 / 设备独立像 (是在同一个方向,一维的) 设备像素(DP) 定义: 设备像素又称物理像素,其尺寸大小是不会变的,从显示屏从工厂出来的那刻起,物理像素点就不会变了。...设备独立像素(DIP) 定义:设备独立像素又称逻辑像素,其尺寸大小是相对的。是一种物理测量单位,基于计算机控制的坐标系统和抽象像素。...其实这个也很好理解,逻辑像素嘛,不就是我们平时用的 CSS 像素么,在 Android 中交设备独立像素。所以 设备独立像素 = CSS 像素。...设备像素比(DPR) 设备像素比 DPR(devicePixelRatio) 是默认缩放为100%的情况下,设备像素和CSS像素的比值。

    2.8K20

    HTMLHTML 注册表单案例 ① ( 表格设置 | 设置表格位置和大小 | 设置表格标题 | 表单设置 | 表格中设置单选按钮 )

    文章目录 一、表格设置 1、设置表格位置和大小 2、设置表格标题 3、完整代码示例 二、表单设置 1、表格中设置单选按钮 3、完整代码示例 一、表格设置 ---- 1、设置表格位置和大小 在 html...页面的 body 标签 中 , 通过 添加 table 标签 , 添加表格 ; 在 table 标签中 , width 属性用于设置 表格的 像素宽度 , 单位是 整数 ; align 属性用于设置...-- 设置表格宽度 600 像素, 表格居中 --> 如果设置了 table 表格的 宽度为 600 像素 , 则...-- 设置表格宽度 600 像素, 表格居中 --> 用户注册信息 二、表单设置 ---- 1、表格中设置单选按钮

    5.6K20

    设备像素和CSS像素

    设备像素和 CSS 像素设备像素又称为 物理像素, 是 "物理屏幕" 上真实存在的发光点,只有屏幕一经出厂就固定不会改变。...CSS 像素又称为 逻辑像素,是编程世界中虚拟的东西, 我们通过代码设置像素都是逻辑像素。...在 PC 端,1个 CSS 像素往往都是对应着电脑屏幕的 1 个物理像素, 所以我们无需关心 PC 端的 CSS 像素和设备像素问题,在手机端,最开始其实 1 个 CSS 个像素也是对应着手机屏幕的 1...iPhone4 的屏幕尺寸却没有变化,但是像素点却多了一倍,这就导致了在 1 个CSS个像素等于 1 个物理像素的手机上, 我们设置1个CSS像素只会占用 1 个物理像素,而在1个CSS个像素不等于1个物理像素的手机上..., 我们设置1个CSS像素就会占用 2 个物理像素, 所以仔细观察你会发现同样是1像素但是在 retina 视网膜屏幕的手机上会粗一些。

    20100

    针对iPhone的pt、Android的dp、HTML的css像素与dpr、设计尺寸和物理像素的浅分析

    最近被一朋友问到:css中设置一DOM的height:65px,请问显示的高度是否和Android的65dp的元素等高?...1.ppi   ppi指Pixels Per Inch也就是每英寸的像素点,此处的像素点就是物理像素点(也就是最小的显示单元)。 ppi描述的是像素的密度,满足以下公式 ?...4.HTML中的css像素和dpr   在HTML中不得不提到viewport,经常会设置viewport的width=device-width,那这个device-width的值是多少呢?...device-width在html中也同样被解读为理想(基准)视口的宽度,即320px,375px,414px,这里的px就是指css像素,通常也被称为逻辑像素;那我们可以认为html中的css像素的显示尺寸应该和...  介绍完上面的概念,我们就可以问答一开始的问题了,css中设置一DOM的height:65px,显示的高度应该和Android的65dp的元素等高。

    1.9K50

    python图片压缩大小及设置图片像素大小120乘160

    python图片压缩大小及设置图片像素大小120乘160 1.在 pycharm 中安装 pillow 库的步骤:打开设置并转到“项目”页面。选择“python 解释器”并单击“+”按钮。...打开PyCharm设置 Windows:File > Settings 2. 转到“项目”页面 在左侧导航栏中,单击“项目”图标。 3....timeNow + imgName) # 生成图片的名字 orgin_photo.save("quality-" + timeNow + imgName, quality=30) # quality 是设置压缩比...,可以理解为图片质量,quality越大质量越好 print("图片保存成功") qualityTest2.py 可以先压缩图片然后再裁剪图片的像素尺寸 import time from PIL import...# 修改像素大小为120 × 160 img_resized = orgin_photo.resize((120, 160)) timeNow = time.strftime("%Y-%m-%d-%H

    11010
    领券