当前位置:首页 > 技术分析 > 正文内容

工作中常用且容易遗忘的 CSS 样式清单整理(一)

ruisui882个月前 (03-02)技术分析6

为大家精心准备了工作中常用的CSS样式,都是自己工作中常用到的记录发,分享给大家,如果觉得可以希望点赞关注和评论。

废话不多说先上图:




最后把源码奉献给大家



	
		
		
		
	
	

	
		
1.文字超出部分显示省略号

测试文字超出部分显示省略号,文字超出部分显示省略号,文字超出部分显示省略号,文字超出部分显示省略号

测试多行文本溢出显示省略号,多行文本溢出显示省略号,多行文本溢出显示省略号,多行文本溢出显示省略号,多行文本溢出显示省略号


2.文字阴影

text-shadow 为网页字体添加阴影,


3.设置placeholder的字体样式

4.设置滚动条样式
条形码(barcode)是将宽度不等的多个黑条和空白,按照一定的编码规则排列,用以表达一组信息的图形标识符 常见的条形码是由反射率相差很大的黑条(简称条)和白条(简称空)排成的平行线图案 条形码可以标出物品的生产国、制造厂家、商品名称、生产日期、图书分类号、邮件起止地点、类别、日期等许多信息 因而在商品流通、图书管理、邮政管理、银行系统等许多领域都得到广泛的应用 条形码(barcode)是将宽度不等的多个黑条和空白,按照一定的编码规则排列,用以表达一组信息的图形标识符 常见的条形码是由反射率相差很大的黑条(简称条)和白条(简称空)排成的平行线图案 条形码可以标出物品的生产国、制造厂家、商品名称、生产日期、图书分类号、邮件起止地点、类别、日期等许多信息 因而在商品流通、图书管理、邮政管理、银行系统等许多领域都得到广泛的应用

5.实现隐藏滚动条同时又可以滚动
条形码(barcode)是将宽度不等的多个黑条和空白,按照一定的编码规则排列,用以表达一组信息的图形标识符 常见的条形码是由反射率相差很大的黑条(简称条)和白条(简称空)排成的平行线图案 条形码可以标出物品的生产国、制造厂家、商品名称、生产日期、图书分类号、邮件起止地点、类别、日期等许多信息 因而在商品流通、图书管理、邮政管理、银行系统等许多领域都得到广泛的应用 条形码(barcode)是将宽度不等的多个黑条和空白,按照一定的编码规则排列,用以表达一组信息的图形标识符 常见的条形码是由反射率相差很大的黑条(简称条)和白条(简称空)排成的平行线图案 条形码可以标出物品的生产国、制造厂家、商品名称、生产日期、图书分类号、邮件起止地点、类别、日期等许多信息 因而在商品流通、图书管理、邮政管理、银行系统等许多领域都得到广泛的应用

6.css 绘制三角形

7.css 实现带边框的三角形:

8.CSS实现文本两端对齐:
文本两端对齐

实现文本

扫描二维码推送至手机访问。

版权声明:本文由ruisui88发布,如需转载请注明出处。

本文链接:http://www.ruisui88.com/post/2406.html

分享给朋友:

“工作中常用且容易遗忘的 CSS 样式清单整理(一)” 的相关文章

Git 分支管理策略汇总

最近,团队新入职了一些小伙伴,在开发过程中,他们问我 Git 分支是如何管理的,以及应该怎么提交代码?我大概说了一些规则,但仔细想来,好像也并没有形成一个清晰规范的流程。所以查了一些资料,总结出下面这篇文章,一共包含四种常见的分支管理策略,分享给大家。Git flow在这种模式下,主要维护了两类分支...

10款超牛Vim插件,爱不释手了

我是一个忠实的Vim编辑器用户,从事开发工作多年,我一直都非常喜欢使用Vim。轻量、便捷,而且,熟悉了Vim相关的快捷键之后,效率能够成倍的提升。除了这些之外,Vim像很多知名的IDE、编辑器一样,也支持插件配置,通过这些插件,可以实现更多高级、高效的操作。今天,就来给大家分享10个我特别喜欢的Vi...

双子座应用程序推出模型切换器以在Android上访问2.0

#头条精品计划# 快速导读谷歌推出了Gemini 2.0 Flash实验版,现已在其安卓应用中可用,之前仅在gemini.google.com网站上提供。新版本的15.50包含模型切换器,用户可以在设置中选择不同模型,包括1.5 Pro、1.5 Flash和2.0 Flash实验版。谷歌提醒,2.0...

Vue真是太好了 壹万多字的Vue知识点 超详细!

1??、Vue和其他两大框架的区别Angular 学习成本太高React 代码可读性差Vue 学习成本较低 很容易上手VUE官方: https://cn.vuejs.org/v2/guide/comparison.html?2??、Vue是什么Vue是一套用于构建用户界面的渐进式框架 "前端...

uni-app基于vue开发小程序与标准vue开发新增点

1、路由跳转传参uni.navigateTo({ url: `/pages/transition/spreadTextAction?t=${this.options.t}&rt=${this.options.rt}&l=${this.options.l}`});uni.navigateBack({...