css备忘录

已于 2022-03-18 18:26:30 修改
阅读量288 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： CSS 文章标签： 前端 css
于 2021-11-26 18:14:04 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/cy1502/article/details/121566070
本文分享了CSS中的一些实用技巧，包括星号*位置垂直居中、强制不换行、内容滚动显示、元素间边距处理、字体缩放、文本溢出省略号、字间距和行间距设置。这些技巧能帮助开发者更好地控制页面布局和样式细节。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

1、星号* 位置偏上 加vertical-align:middle
2、强制不换行 white-space:nowrap
3、超出范围内容变滚动width:200px;white-space:nowrap;overflow:hidden
4、除最后一个元素之外的元素添加底边 .box:not(:last-child) {boder-bottom:1px solid #eee}
5、设置10px的字体：transform：scale(0.83)
6、超出部分显示省略号：text-overflow:ellipsis;
7、字间距：letter-spacing:1px;
8、行间距：line-height:14px; *行内有icon用这个属性可以调整对齐 *
9、全局注册的css文件内不需要用/deep/这样的深度选择器,写了反而会不生效

CSS备忘录
web_hj的博客
07-17 172
CSS 及CSS3 样式 1.text-shadow 文本阴影 text-shadow: 5px 5px 5px #FF0000; 2.box-shadow 盒子阴影 box-shadow: 10px 10px 5px #888888; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); 卡片效果 box-shadow 的顺序依次为: h-shadow v-shadow blur
css属性的备忘录
沐沐
10-17 1054
在写html的过程中发现很多基础性的东西还是经常忘，因此开一篇博客为最基础基础的这些知识做一个备忘，尽快熟悉~~ overflow 属性定义和用法：verflow 属性规定当内容溢出元素框时发生的事情。 可能的值： 今天使用时出现的情况是，在导航栏的制作过程中使用了hidden，即如果方框内容溢出，则溢出部分不会显示。自己写的时候并没有注意到这种情况，是看了别人的代码发现的~多多学习，应
CSS样式备忘录
竹亦叶同的博客
04-15 403
单行文字截断… word-wrap: normal; /* for IE */ text-overflow: ellipsis; white-space: nowrap; overflow: hidden; 多行文字 截断… overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -web...
css 样式备忘录
baimanmu3398的博客
08-26 195
1、使用百分比设置宽度 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> ...
CSS 布局备忘录
灵动的艺术的博客
06-07 1257
假设容器的宽度为400px, 子项1的占用的基础空间(flex-basis)为50px，子项2占用的基础空间是70px，子项3占用基础空间是100px，剩余空间为 400-50-70-100 = 180px。假设容器的宽度为400px, 子项1的占用的基准空间(flex-basis)为250px，子项2占用的基准空间是150px，子项3占用基准空间是100px，总基准空间为 250+150+100=500px。容器放不下，多出来的空间需要被每个子项根据自己设置的flex-shrink 进行吸收。
备忘录：HTML，CSS和Vanilla JavaScript
02-08
像telasestãoresponsivas at a Largura de 500px一样，focada noespaçocentral，assim facilita备忘录是das cartas，esta funcionalidadenãoestálistada no desafio mas resolvi deixar uma breve视觉化的das ...
KNACSS框架CSS备忘录快速参考指南
资源摘要信息:"KNACSS是一个轻量级的CSS框架，它是为了提高网页设计和开发的效率而设计的。KNACSS v4备忘单是该框架的一个快速参考指南，它包含了所有关键的KNACSS特性、类名和用法，方便开发者快速回顾和使用。 ...
vue实现日历备忘录功能
10-16
综上所述，要实现一个完整的Vue日历备忘录功能，你需要结合提供的基础日历HTML和CSS，加上Vue的数据绑定、事件处理和组件化思想，进一步开发备忘录的逻辑和交互。这不仅要求对Vue.js框架有深入理解，还需要掌握良好...
html制作的备忘录html制作的备忘录
06-27
综上所述，创建一个HTML备忘录应用需要掌握HTML的基本结构和元素，理解如何通过CSS进行美化，以及使用JavaScript增加交互性。通过`todoList-master`这个文件名，我们可以猜测这可能是一个关于任务管理的实例，可能...
你的css选择器可视化备忘录
weixin_52884694的博客
04-08 957
这个 CSS 规则选择了在另一个元素之后出现的任何元素（除了容器中的第一个元素），并在顶部应用了一定的边距，有效地使元素均匀地间隔开来。有一种望而却步的赶脚。，因为它会匹配页面上的所有元素，包括嵌套元素，这可能会增加浏览器的渲染负担。这使得子选择器非常有用，因为它可以帮助我们更精确地定位特定层次结构的元素，并应用相应的样式。允许我们选择与指定元素具有相同父元素且位于其后面的所有兄弟元素，而不仅仅是直接的兄弟元素。例如，如果我们想为页面上的所有元素设置相同的字体样式，我们可以使用通用选择器来实现。
CSS3备忘录
程序员的世界
12-16 360
目录 一、背景 二、css选择器 三、css元素分类 四、CSS三大特性 五、CSS三大模块 5.1、盒子模型 5.2、浮动-float 浮动使用方式 浮动特性 清除浮动 5.3、定位 5.3.1、边偏移 5.3.2、定位模式 5.3.2.1、相对定位模式 5.3.2.2、绝对定位模式 5.3.2.3、固定定位模式 5.4 定位总结 一、背景 对...
移动端垂直居中字体偏上解决方案
Buddha_ITXiong的博客
02-15 3896
做项目的时候发现给盒子设置垂直居中，在PC端是没有问题的但是在移动端上面字体会有明显的偏上 ，设置的line-height和flex布局 align-item:center均无效，在网上找了很多方法最后总结为：在移动端有很多手机不支持line-height,会有自己默认的22px的行高，但是我没有去考究。 我是通过以下设置解决的，亲测有效。padding随自己设定 ...
关于HTML/CSS的排版的备忘录
keep coding
03-16 1961
body{     font-family:"微软雅黑";} } //确定字体的类型 body{font-size:12px;color:#666;}//字体大小与颜色设置。 p{     font-weight:bold; //字体粗体的设置 } p{     font-style:italic;     }//斜体字 p{
红色*号字符垂直居中显示
热门推荐
GTraveler
09-19 1万+
在编写一些表单时，我们使用红色*号，作为必填项，我们一般都想要红色星号能够垂直居中显示，看起来更美观： .xing { font-size: 30px; color: #f00; } <h3>如果是<span class="xing">*</span>则必填</h3>结果如下： 所以我们需要添加css样式：.xing { w
5G毫米波射频前端设计：从GaN功放到混合信号集成方案
最新发布
ytttr873的博客
07-31 272
同时，GaN功放还具备较高的功率附加效率（PAE），相比传统的半导体材料功放，能够在提供相同功率输出的情况下消耗更少的电能，这对于降低设备的能耗和散热需求具有重要意义。随着5G通信技术的飞速发展，毫米波频段凭借其丰富的频谱资源，成为满足5G高速率、大容量数据传输需求的关键频段。然而，毫米波信号的高频特性带来了诸多设计挑战，射频前端作为无线通信系统中负责信号发射与接收的核心部分，其设计至关重要。GaN功放通过优化电路设计和工艺，能够在高功率输出的情况下保持良好的线性度，确保信号在传输过程中的准确性和可靠性。
js面试题 高频(12-22题)
m0_63472757的博客
07-29 999
1.代码服用与抽象: 高阶函数可以将重复的逻辑抽象出来,形成通用函数,提高代码的复用性,柯李华可以将复杂的函数调用转化为一系列简单的步骤,便于部分应用和服用2.函数组合: 高阶函数和柯里化是构建函数式编程风格的关键,它们使的函数的组合变得更容易,从而构建更复杂的功能3.延迟执行与配置化: 柯里化可以将函数执行延迟到所有参数都传入后进行,同时允许在传入部分参数时进行配置,生成定制化的新函数。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值