Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

常用CSS查看表 #15

Open
shaobeichen opened this issue Jul 13, 2018 · 0 comments
Open

常用CSS查看表 #15

shaobeichen opened this issue Jul 13, 2018 · 0 comments

Comments

@shaobeichen
Copy link
Owner

shaobeichen commented Jul 13, 2018

banner

平时要使用的常用CSS比较多,比如多行省略,单行省略,诸如此类,每次都一个一个查麻烦,直接保存我这个网页,打开之后,Ctrl+F查找就行了,美滋滋。

单行文本的溢出显示省略号

p {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

多行文本的溢出显示省略号

p {
   overflow : hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
}

单选框美化样式

 input[type='radio'] {
    background: url("../images/enterfor/enterfor_03.png") no-repeat center/cover;
    -webkit-appearance: none;
    width: 23px;
    height: 23px;
    margin-left: -30px;
    border-radius: 0;
    border: none !important;
}

 input[type='radio']:checked {
    background: url("../images/enterfor/enterfor_02.png") no-repeat center/cover;
}

background-size 失效

这样写的话 background-size 没效果

{
background-size:contain;
background:url(xxx);
}

把两个交换下顺序,即换成下面这样就生效了

{
background:url(xxx);
background-size:contain;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant