首页 > 其他分享 >CSS常用属性

CSS常用属性

时间:2023-06-13 20:11:19浏览次数:28  
标签:常用 repeat 背景 百分比 background 图像 取值 CSS 属性

颜色

  1. RGB

    (红,绿,蓝)三种颜色的集合,最低值是0(十六进制00)到最高值255(十六进制FF)

  2. HSL

    H色相(0-360),S饱和度(百分比),L亮度(百分比)

  3. (不)透明度

    rgba、hsla (新版浏览器可不写a,直接写4个值)

line-height

行间距(letter-spacing字母间间距,word-spacing 单词间距 )

描述
normal 默认。设置合理的行间距。
number 设置数字,此数字会与当前的字体尺寸相乘来设置行间距。
length 设置固定的行间距。
% 基于当前字体尺寸的百分比行间距。
inherit 规定应该从父元素继承 line-height 属性的值。

background

1. background-position

background-position属性用于指定背景图像的位置。它可以采用的取值及其含义如下:

  • length:用长度值指定背景图像的位置,取值范围为像素、百分比等。
  • percentage:用百分比值指定背景图像的位置,表示相对于背景区域宽度和高度的百分比。
  • left/center/right:用关键词指定背景图像的水平位置,取值为 left表示左对齐,取值为 center表示居中,取值为 right表示右对齐。
  • top/center/bottom:用关键词指定背景图像的垂直位置,取值为 top表示顶端对齐,取值为 center表示居中,取值为 bottom表示底部对齐。
  • x y:用坐标值指定背景图像的位置,表示相对于背景区域左上角的坐标值。

2. background-size

background-size属性用于指定背景图像的大小。它可以采用的取值及其含义如下:

  • length:用长度值指定背景图像的宽度和高度,取值范围为像素、百分比等。
  • percentage:用百分比值指定背景图像的宽度和高度,表示相对于背景区域宽度和高度的百分比。
  • auto:背景图像自适应宽度和高度。
  • cover:拉伸或压缩背景图像使其填充整个背景区域,可能会导致背景图像被裁剪。
  • contain:拉伸或压缩背景图像使其全部显示在背景区域中,可能会在背景区域内留有空白。

3. background-repeat

background-repeat属性用于指定背景图像的重复方式。它可以采用的取值及其含义如下:

  • repeat:沿x轴和y轴重复背景图像,以填充整个背景区域。
  • repeat-x:沿x轴重复背景图像,y轴方向不做处理。
  • repeat-y:沿y轴重复背景图像,x轴方向不做处理。
  • no-repeat:不重复背景图像,只在背景区域内呈现一次。

复合写法:

background: url或颜色 no-repeat center/cover;

斜杠不能少
未完待续......

标签:常用,repeat,背景,百分比,background,图像,取值,CSS,属性
From: https://www.cnblogs.com/jeffery-liu/p/17478624.html

相关文章

  • adb常用指令备忘
    adbdevices查看设备adbkill-server关闭adb后台服务进程adbtcpip让Android脱离USB线,启动tcp模式adbconnect连接开启了tcp模式的Android机adblogcat拉取手机的日志(过滤信息,linux中使用|grepxx,windows中使用|findstrxxx)adbbu......
  • docker常用命令
    帮助启动类命令·启动docker:systemctlstartdocker·停止docker:systemctlstopdocker·重启docker:systemctlrestartdocker·查看docker状态:systemctlstatusdocker·开机启动:systemctlenabledocker·查看docker概要信息:dockerinfo查看docker总体帮助文档:docke......
  • 10分钟让你掌握Linux常用命令(+3万+++收藏)
    1、常用Linux命令2、Linux下脚本编写3、windows下CMD常用命令文章目录一、目录操作1、批量操作二、文件操作三、文件内容操作(查看日志,更改配置文件)1、grep(检索文件内容)2、awk(数据统计)3、sed(替换文件内容)4、管道操作符`|`5、cut(数据裁剪)四、系统日志位置五、创建与删除软连......
  • 值得一看的35个Redis常用问题总结
    1.什么是redis?Redis是一个基于内存的高性能key-value数据库。2.Reids的特点Redis本质上是一个Key-Value类型的内存数据库,很像memcached,整个数据库统统加载在内存当中进行操作,定期通过异步操作把数据库数据flush到硬盘上进行保存。因为是纯内存操作,Redis的性能非常出色,每秒可......
  • SQLServer低版本附加高版本的数据库常用处理方法
    SqlServer低版本数据库不能直接还原或附加Sql高版本数据库或备份文件,我们常用DTS互导的方式,如果不同版本数据库不可访问,可以使用高版本数据库的DTS导出整个库的相应低版本建库脚本与数据,然后放在低版本数据库中去执行,常见如:我们库数据库一般是SqlServer2008+,有的客户使用的是2005版......
  • 运维巡检常用命令
    Linux系统需要定期巡检,以检查服务器软硬件使用情况,确保可以及时发现问题、解决问题,降低损失。常用的巡检命令如下:uname-a查看内核/操作系统/CPU信息head-n1/etc/issue查看操作系统版cat/proc/cpuinfo查看CPU信息hostname查看计算机名lspci-tv列出所有PCI设备lsu......
  • 服务器巡检常用命令
    Linux系统需要定期巡检,以检查服务器软硬件使用情况,确保可以及时发现问题、解决问题,降低损失。常用的巡检命令如下:free-m查看内存使用量和交换区使用量df-h查看各分区使用情况du-sh<目录名>查看指定目录的大小uptime查看系统运行时间、用户数、负载w查看活动用户l......
  • 【git】git submodule的常用方法
    一、官网   https://git-scm.com/docs/git-submodule 文章写的也很详细了,就不重复写了,以官网资料为准  参考链接:git之submodule的使用-chrislzy-博客园......
  • 84 局部变量 在get set等方法中 ;成员变量在属性中
    packagecom.fqs.demo061302;publicclassGirl{//属性//成员变量Stringname;privateintage;publicvoidsetAge(intage){//【局部变量】名称可以和上面的【成员变量】一样//赋值if(age<50&&age>18){this......
  • vue 报错 !!vue-style-loader!css-loader?{“sourceMap“:true}!.
    npmrundev报错Thesedependencieswerenotfound:*!!vue-style-loader!css-loader?{"sourceMap":true}!../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-858b20d4","scoped":true,......