css基础笔记(持续添加)

来源:互联网 发布:淘宝心选没有彩虹系统 编辑:程序博客网 时间:2024/06/05 10:49
解决因为文字长度不一致而导致textbox无法对齐.textmod span {height:30px;text-align:justify;display:inline-block;vertical-align:top;line-height:30px;width:60px;}溢出隐藏文字:{overflow:hidden;text-overflow: ellipsis; }强制不换行 div{ white-space:nowrap; } 自动换行 div{ word-wrap: break-word; word-break: normal; } 强制英文单词断行 div{ word-break:break-all; } hove经过状态改变其他div的状态.class a:hove .abc{}图片自适应div大小background:url(../image/pr_gb.png);//此处为你的图片background-repeat:no-repeat; -moz-background-size:100% 100%;background-size:100% 100%;播放器拉伸:#myvideo { object-fit:fill; padding:0 !important;}ss的动画:.featured-image:hover {    animation: ttt 2s 1 forwards;//ttt自定义的动画规则}@keyframes ttt {    10% {        background: rgba(70, 70, 70, 0.0);        border-radius: 5px;    }    40% {        background: rgba(70, 70, 70, 0.2);        border-radius: 5px;    }    76% { /*这里表示3s的66%也就是大约2秒的时候*/        background: rgba(70, 70, 70, 0.4);        border-radius: 5px;        color: rgba(255, 255, 255, 1);        text-shadow: black 5px 3px 3px;    }    100% {        background: rgba(70, 70, 70, 0.5);        color: rgba(255, 255, 255, 1);        text-shadow: black 5px 3px 3px;        border-radius: 5px;    }}//一般用百分比来做关键帧率的获取1.css禁用鼠标点击事件.disabled { pointer-events: none; }div居中方法(未验证)1.center-in-center{               position: absolute;               top: 50%;               left: 50%;               -webkit-transform: translate(-50%, -50%);               -moz-transform: translate(-50%, -50%);               -ms-transform: translate(-50%, -50%);               -o-transform: translate(-50%, -50%);               transform: translate(-50%, -50%);           }   2:  var btn = document.getElementById("btnManel");            var WinHeight = document.documentElement.clientHeight;            var WinWidth = document.documentElement.clientWidth;            var btnTop = btn.offsetHeight;            var btnWidth = btn.offsetWidth;            var btnTopValue = (WinHeight - btnTop) + "px";            var btnWidthValue = (WinWidth - btnWidth) + "px";            btn.style.top = btnTopValue;
原创粉丝点击