标签：场景 vertical top 元素 使用 对齐 pointer css 属性

一、display:inline-block;

在想标签处于一行，设置值为inline-block，经常会有标签之间对齐方式不一致的问题，此时新增另外一个属性vertical-align: top;即可，经常使用的是top或者middle。

display: inline-block;
/* 
  baseline    默认。元素放置在父元素的基线上。
  sub    垂直对齐文本的下标。
  super    垂直对齐文本的上标
  top    把元素的顶端与行中最高元素的顶端对齐
  text-top    把元素的顶端与父元素字体的顶端对齐
  middle    把此元素放置在父元素的中部。
  bottom    使元素及其后代元素的底部与整行的底部对齐。
  text-bottom    把元素的底端与父元素字体的底端对齐。
  length    将元素升高或降低指定的高度，可以是负数。
  %    使用 "line-height" 属性的百分比值来排列此元素。允许使用负值。
  inherit    规定应该从父元素继承 vertical-align 属性的值。
*/
vertical-align: top;

二、pointer-events: none;

我一直认为pointer-events有点像js的功能，它的作用如下：

       阻止用户的点击动作产生任何效果        阻止缺省鼠标指针的显示        阻止CSS里的hover和active状态的变化触发事件        阻止JavaScript点击动作触发的事件

/* 
  auto    默认值。元素对指针事件做出反应，比如 :hover 和 click。
  none    元素不对指针事件做出反应。
  inherit    从其父元素继承此属性。
*/
pointer-events: none;

 

标签：场景,vertical,top,元素,使用,对齐,pointer,css,属性
来源： https://www.cnblogs.com/beichende-luke/p/15950928.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。