代码编织梦想

补:

文字的垂直居中:文字的高度等于盒子的高度

文字偏上:行高小于盒子高度

文字偏下:行高大于盒子高度

 

 

1.背景颜色

2962d357e91a4f9590c55d3f522bc174.jpg

一般,默认的背景颜色为transparent(透明)

 

 

2.背景图片

logo  装饰性的小图片  超大的背景图片

99134ab76c2a4067a65bc31195282e0b.jpg

要有url()   相对位置 /

593f71ea6dac448d8e4eaf15d207efb3.jpg

 

 

3.背景平铺

d5f54f8308b945d2a733f7a321cad4b4.jpg

 页面元素既可以添加背景图片,又可以添加背景颜色,只不过背景图片会压住背景颜色

 

4.背景图片的位置-方位名词

1e5a423be09046f38bd7fedecbb82ea1.jpg

 若两个值都是方位名词,则两个值的前后顺序无关

若只指定了一个方位名词,第二个默认居中

 

背景图片的位置-精确位置

若参数值为精确坐标,第一个为x,第二个为y

若只给一个值,该数值一定是x轴,另一个默认垂直居中

 

背景图片的位置-混合位置

若精确单位和方位名词混合使用,第一个值为x坐标,第二个值为y坐标

 

 

5.背景图片的固定

6eb276bb8bc8412ba75b7f6e015a3a47.jpg

 

 

符合写法:

3345fc02b39f457590c6b4ad5aa79de7.jpg

 

背景颜色半透明:

13c783c39c834774a7b92dfab61f8c39.jpg

alpha透明度:取值0-1

alpha为0 透明    1不透明

黑色 rgb(0,0,0)

半透明是让盒子的背景色半透明,盒子里的内容没有影响

 

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/m0_62608983/article/details/128755059

Web前端——CSS基础样式-爱代码爱编程

文章目录 一. 样式的继承1. 定义2. 范围3. 优点4. 注意5. 例子二. 选择器的权重1. 样式的冲突(1). 定义2. 选择器的权重(1). 定义(2). 优先级三. 单位1. 长度单位定义2. em3. rem4. 颜色(1). RGB值:(2). RGBA值:(3). 十六进制的RGB值(4). HSL值和HSLA值(5). 例子四.

Web前端开发笔记之CSS拓展04——背景图大小、过渡-爱代码爱编程

1.背景图片大小 很多时候我们在使用图片的时候,会发现图片和我们的盒子大小不匹配的情况。   .picPart{ width: 300px; height: 500px; background-image: url("/Res/video&photo/tanzhilang

Web前端开发之CSS学习笔记3—颜色和背景-爱代码爱编程

目录 1.CSS的颜色表达 1.1前景色color 1.2背景色background-color 2.背景 2.1 background-image:url()设置背景图; 2.2 background-repeat 属性设置是否及如何重复背景图像 2.2.1 background-repeat: no-repeat设置背景图不重复 2

web前端入门(十五)css背景_treesorshining的博客-爱代码爱编程

总目录 文章目录 1.背景颜色2.背景图像3.背景平铺4.背景位置5.背景附着6.背景复合写法7.背景色半透明8.背景总结 通过 CSS 背景属性,可以给页面元素添加背景样式。 背景属性可以设置背景颜色、背景图片、背景平铺、背景图片位置、背景图像固定等。 1.背景颜色 background-color 属性定义了元素的背景颜色backgro

web(七)-爱代码爱编程

Bootstrap 概念 一个前端开发的框架,Bootstrap,来自 Twitter,是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JavaScript 的,它简洁灵活,使得 Web 开发更加快捷。 * 框架:一个半成品软件,开发人员可以在框架基础上,在进行开发,简化编码。 * 好处: 定义了很多的css样式和js

web前端,css背景图片大小、文字阴影、盒子阴影、过渡_web设置背景图片大小-爱代码爱编程

前言 持续学习总结输出中,今天分享的是Web前端,CSS背景图片大小、文字阴影、盒子阴影、过渡 背景图片大小 background-size:宽度 高度; 设置背景图片的大小 取值场景数字+px简单方便,常用百