CSS基础 元素整体透明效果(包含内容+背景及子元素)
属性名:opacity:数字+px; 数字值取值0-1之间数字
数字值:1表示完全不透明
0表示完全透明
使用后效果
html结构代码
<div class="box">
<img src="./images/code.jpg" alt="">
</div CSS结构代码
<style>
.box{
width: 400px;
height: 400px;
background-color: red;
opacity: .5;
}
</style>
CSS基础 元素整体透明效果(包含内容+背景及子元素)的更多相关文章
- css基础语法二(常用文本与背景属性)
[CSS常用文本属性] 1. 字体.字号类:① font-weight: 字体粗细. bold-加粗.normal-正常.lighter-细体 也可以使用100-900数值,400表示normal,7 ...
- 父元素a标签的href默认行为以及子元素绑定的click事件的响应之间存在影响
原文地址 背景 开发过程中遇到问题,简单写个demo 运行环境为Chrome 68 描述一下这个问题,当a标签内部存在嵌套时, 父元素a标签的href默认行为以及子元素绑定的click事件的响应之间存 ...
- html、css和js原生写一个模态弹出框,顺便解决父元素半透明子元素不透明效果
模态框: html部分: <!-- 按钮 --> <button id="box" onclick="pop_box()">弹出框< ...
- jQuery编程基础精华02(属性、表单过滤器,元素的each,表单选择器,子元素过滤器(*),追加方法,节点,样式操作)
属性.表单过滤器 属性过滤选择器: $("div[id]")选取有id属性的<div> $("div[title=test]")选取title属性为 ...
- QT下的几种透明效果(QPalette背景白色,窗口设置setWindowOpacity,QPainter使用Clear模式绘图)
1.窗口整体透明,但是窗体上的控件不透明. 通过设置窗体的背景色来实现,将背景色设置为全透. QPalette pal = palette(); pal.setColor(QPalette::B ...
- 父元素高度设置为min-height,子元素高度设置为100%,但实际上子元素高度你知道是多少吗?
前言 给父元素一个min-height,子元素设置height:100%. 代码 <!DOCTYPE html> <html> <head> <title&g ...
- (转自MDN)CSS基础一定要看的包含块(containing block)
之前在写<个人常用的水平居中方法>这篇文章的时候,百分比问题涉及到了包含块(containing block)这个概念. 今天刷面试题的时候,又看到了containing block这个词 ...
- 【CSS基础】实现 div 里的内容垂直水平居中
方案一: 所有内容垂直水平居中 兼容性:IE8+. 条件:内容宽度和高度可以未知,可以是多行文字.图片.div. 描述:使用table-cell + vertical-align , html代码见文 ...
- 【WEB基础】HTML & CSS 基础入门(5)边框与背景
前面(HTML图片) 漂亮的网页肯定少不了边框与背景的修饰,本篇笔记就是说明如何为网页上的元素设置边框或者背景(背景颜色和背景图片). 之前,先了解一下HTML中的图片元素,因为图片标签的使用非常简单 ...
随机推荐
- springMVC中@requestMapper的使用和注意事项
package com.hope.controller;import org.springframework.stereotype.Controller;import org.springframew ...
- 『与善仁』Appium基础 — 21、元素的基本操作
目录 1.元素的基本操作说明 (1)点击操作 (2)清空操作 (3)输入操作 2.综合练习 1.元素的基本操作说明 (1)点击操作 点击操作:click()方法.(同Selenium中使用方式一致) ...
- 基于Kubernetes的hpa实现pod实例数量的自动伸缩
Pod 是在 Kubernetes 体系中,承载用户业务负载的一种资源.Pod 们运行的好坏,是用户们最为关心的事情.在业务流量高峰时,手动快速扩展 Pod 的实例数量,算是玩转 Kubernetes ...
- win10 linux ubuntu子系统 使用adb
条件 本文已经默认你已经在win10系统下成功配置了ubuntu子系统,所以唯一的条件就是windows上的adb 版本和ubuntu子系统的adb版本一致. 方法 怎么来保证adb 版本一致呢?在本 ...
- LuoguP1785 漂亮的绝杀 题解
Content 因太占排版,请自己去题面查看. Solution 声明:以下和题面相同的变量的意义均和题面相同. 这个题目 \(\texttt{if}\) 操作很多,其他的就是纯模拟. 首先,我们先判 ...
- CF390A Inna and Alarm Clock 题解
Content 平面内有 \(n\) 个整点 \((x_i,y_i)\).每次可以去掉一行或一列的点,问最少去几次(按行去点或按列去点二者只能选择一种). 数据范围:\(1\leqslant n\le ...
- LuoguB2035 判断数正负 题解
Content 给定一个数 \(n\),判断这个数的正负. 数据范围:\(-10^9\leqslant n\leqslant 10^9\). Solution 一个基础的分支结构题. if-else ...
- DNS解析超时排查/etc/resolv.conf single-request-reopen参数说明
添加 options rotate timeout:1 attempts:3 single-request-reopen 添加到/etc/resolv.conf 中 #释义: 循环查询 超时时间 重试 ...
- org.apache.taglibs.standard.tlv.JstlBaseTLV.validate
exception org.apache.jasper.JasperException: PWC6033: Error in Javac compilation for JSP org.apache. ...
- 20款GitHub上优秀的Go开源项目
docker 无人不知的虚拟华平台,开源的应用容器引擎,借助该引擎,开发者可以打包他们的应用,移植到任何平台上. https://github.com/docker/docker 38154 star ...