Css样式小笔记集合 [持续更新中]

①文字超出则省略显示

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

②响应式布局

	.father{
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		.son{
			alingn-self: center;
		}
	}

③内容不换行

	.father{
		white-space: nowrap;
	}

④固定搜索栏的样式
码在要固定的搜索的区域内
页面内容会被遮挡,码个padding-top即可

	.css{
		position: fixed;
		top: 100; // 根据搜索栏高度去定义
		z-index: 100; // 该内容显示在最前面
	}

⑤手机界面,输入键盘右下角显示"搜索 / 换行"
input标签,comfirm-type属性的有效值

	// 显示搜索
	<input type="text" comfirm-type="search" />
	// 显示换行
	<input type="text" comfirm-type="next" />

⑥设置字体间的距离

	.css{
		letter-spacing: 2px;
	}

⑦随手机型号可变长度的单位
vw、vh、upx、rpx、%
vw (view width),vh(view height),相当于一种长度单位,类似百分比,1vw = 屏幕宽度的百分之一,1vh = 屏幕高度的百分之一,是属于一种自适应的长度单位。

温馨提示:
喜欢灰碟分享的小伙伴不要忘记关注噢~这样子,想找我时就不会迷路啦*

联系方式:
Vx+:LHD7575

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值