首页 > 其他分享 >css inset属性

css inset属性

时间:2023-01-23 15:06:51浏览次数:31  
标签:right bottom 2px 1px inset css 属性

inset属性说明如下:

​inset​​​ 属性用作定位元素的 ​​top​​​、​​right​​​、​​bottom​​​、​​left​​​ 这些属性的简写。类似于 ​​margin​​​ 和 ​​padding​​ 属性,依照“上右下左”的顺序。举个例子:

inset: 0; 
/* 等同于 `top: 0; right: 0; bottom: 0; left: 0;` */
inset: 1px 2px;
/* 等同于 `top: 1px; right: 2px; bottom: 1px; left: 2px;` */
inset: 1px 2px 3px;
/* 等同于 `top: 1px; right: 2px; bottom: 3px; left: 2px;` */
inset: 1px 2px 3px 4px;
/* 等同于 `top: 1px; right: 2px; bottom: 3px; left: 4px;` */

inset CSS属性,它具有与简写边距相同的多值语法。虽然是CSS逻辑属性规范的一部分,但它定义物理偏移量,而不考虑元素的书写模式、方向和文本方向。属性值可以为长度,百分比,关键字(auto),全局的值(inherit; initial; revert; revert-layer; unset;)

注意:inset 属性只作用于定位元素。Internet Explorer 浏览器上不支持该属性。

箴言:因为这些东西是非常简单的。不要抱怨自己学不会,那是因为你没有足够用心。




标签:right,bottom,2px,1px,inset,css,属性
From: https://blog.51cto.com/echohye/6021889

相关文章

  • Web自动化测试04:Selenium-XPath、CSS定位
    文章目录​​系列文章目录​​​​学习目标​​​​一、什么是XPath?​​​​二、XPath定位策略(方式)​​​​2.1路径定位(绝对路径、相对路径)​​​​2.2利用元素属性​​......
  • js dom节点的属性不能访问
    有些时候,我们会发现DOM节点的某个属性通过dom.XXX不能访问实际上,DOM也是一个对象,当我们通过控制台打印出来后,会发现这个属性并不在DOM节点上面,我们需要先setAttribute,之后......
  • 7、CSS权威指南--特指度和层叠
    继承是指把一个元素的某些属性值传递给后代的机制。确定应该把哪些值应用到元素上时,用户代理不进要考虑继承,还要考虑声明的特指度,以及声明的来源。这个过程称为层叠。1、......
  • 6、CSS权威指南--选择符
    1、元素选择符,文档中的元素是最基本的选择符  html{color:red;}p{font:mediumHelvetica;}2、群组选择符  a、多个选择符之间用逗号隔开  h1,p{......
  • css 伪元素
    概念伪元素是一个附加至选择器末的关键词,允许你对被选择元素的特定部分修改样式。MDN链接https://developer.mozilla.org/zh-CN/docs/Web/CSS/Pseudo-elements......
  • css 伪类
    伪类使用:来表示a:link{color:#FF0000;}/*未访问的链接*/a:visited{color:#00FF00;}/*已访问的链接*/a:hover{color:#FF00FF;}/*鼠标划过链接*/a:active{......
  • CSS简单了解
    CSSCSS是一门语言,用于控制网页表现CSS(CascadingStyleSheet):层叠样式表W3C标准:网页主要由三部分组成结构:HTML表现:CSS行为:JavaScriptCSS体验:<!DOCTYPEhtml......
  • 使用 UnoCSS shortcuts 简化 class
    UnoCSS确实简化了不少样式书写、也降低了CSS打包体积,提升了样式使用率。但样式太多的话,class也写得多,比较费眼。所幸,UnoCSS提供了shortcuts来简化class,并且可以通......
  • Java CSS3
    CSS层叠级联样式表快速入门CSS可以在html文件中写,写在<style>中,一般style写在head中(HTML,CSS没有分离)<style>h1(选择器){ 可以设置h1的属性(声明,分号结尾)}<......
  • java CSS3
    CSS层叠级联样式表快速入门CSS可以在html文件中写,写在<style>中,一般style写在head中(HTML,CSS没有分离)<style> h1(选择器){可以设置h1的属性(声明,分号结尾)......