syon的博客

待我长大成人!和你私奔~

第十一章 img特征 vertical-align cursor opactiy

img特征

  1. 支持宽高
  2. 支持margin
  3. 支持横排展示
  4. 支持text-align(水平居中 在父级元素中设置 作用到子集)
  5. 支持vertival-align(垂直方向居中 设置给本身 作用自己)

vertical-align:垂直方向对其

定义行内元素的基线 相对与该元素所在行的基线的垂直对齐
inline inline-block img才具有 块级元素没有

vertical-align的值:
 1. top 元素的顶端与行中最高元素的顶端对齐
 2. middle 此元素放置在对应元素中部
 3. bottom 元素的底端与行中最低元素的底端对齐
 总结:以上的值与line-height相关
 1. text-top 元素的顶端与父元素字体的顶端对齐
 2. text-bottom 把元素的底端与度元素字体的底端对齐
 3. baseline 默认元素放置在父元素的基线上
 总结:以上的值与font-size相关

注意:

  1. 加上vertical-align的同排元素都要加上verticla-align
  2. vertical-align 可以解决img 下方间隙问题

cursor

指针样式(规定鼠标进入元素内容区域要显示的光标类型)
值:
  1. default
  2. auto
  3. pointer
  4. move
  5. text
  6. wait
  7. help

    引入外部指针样式
    cursor:url(hand.cur) pointer
    第一个值:url定义指定问价路径 此文件以cur为扩展名
    第二个值:当第一个值出现错误时的备用类型


opacity 透明度

  1. 标准 不透明度:opacity:0~1 0完全透明 1完全不透明
  2. IE滤镜(兼容ie下不支持opacity的版本)
    filter:alpha(opacity=0~100); 0完全透明 100 完全不透明
    两者成倍数关系
阅读更多
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/csnd_syon_javaweb/article/details/78170101
个人分类: HTML+CSS
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭