您的位置：首页 > Web前端 > CSS

CSS实用代码：清除浮动、单行省略号、图片宽高比例、display兼容代码、三角形状

2018-02-27 11:51 525 查看

图片宽高比例：
.newsli01a{width: 100%;
height: 0;
padding-bottom: 73%;
overflow: hidden; position:relative;}

清除浮动：
.clearfix:after{content:'.';display:block;clear:both; visibility:hidden; height:0;}

单行省略号：
p{overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}

模块居中代码： content{width: 90%; margin:0 auto; }

display兼容代码： display:inline-block; *zoom:1; *display: inline;

三角形状：
<body>
<style>
.sss{width:50px; height:50px; }
.sss div{
float:left;
line-height:0px;
border:10px dashed transparent ;
border-bottom:10px solid #00f;}
</style>
<div class="sss">
<div>
</div>
</div>
</body>

<input type="text" class="hinput01" placeholder="搜索或输入网址"/>
.hinput01::-webkit-input-placeholder {
color: white;
}
.hinput01::-moz-placeholder {
color: white;
}
.hinput01::-ms-input-placeholder {
color: white;
}

一次性模拟iPhone和安卓手机
开始–运行中输入以下命令，启动浏览器：

模拟谷歌Android：
chrome.exe --user-agent="Mozilla/5.0 (Linux; U; Android 2.2; en-us; Nexus One Build/FRF91) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1"

模拟苹果iPhone：
chrome.exe --user-agent="Mozilla/5.0 (iPad; U; CPU OS 3_2_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B500 Safari/531.21.10"

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航