css属性

letter-spacing 和 line-height 分别控制字符横向与行间纵向间距。前者用 px/em 调整字间距，正值变宽、负值紧凑，适用于标题或大写字母；后者推荐无单位数值如 1.5~1.8，提升段落可读性，常用于垂直居中。合理搭配二者可显著优化文本视觉效果与阅读体验。 在网页排版中，le…

使用Autoprefixer可自动为CSS属性添加浏览器前缀，通过PostCSS集成并结合.browserslistrc配置目标浏览器，实现高效兼容性处理，避免手动维护冗余代码。 在现代前端开发中，为了确保 CSS 样式在不同浏览器中正常运行，经常需要为某些属性添加浏览器前缀，比如 -webkit-…

通过CSS选择器与:hover结合可实现丰富交互效果，如按钮悬停变色缩放、卡片悬停显示隐藏内容、带提示按钮抖动及链接下划线滑入，关键在于精准选择元素并合理设置transition或@keyframes动画参数。 CSS选择器与:hover动画结合使用，可以实现丰富的交互效果，比如鼠标悬停时改变样式、…

使用 :focus 伪类可实现输入框聚焦高亮，通过 border-color、box-shadow 和 transition 等属性提升交互体验，同时需注意保留 outline 以保障可访问性。 当用户点击或使用Tab键聚焦到输入框时，可以通过 :focus 伪类来触发样式变化，实现高亮效果。这是提…

CSS样式优先级由选择器权重、!important、源顺序等决定，权重高者生效；2. 权重按内联、ID、类/属性/伪类、标签依次降低，相同权重后定义覆盖前定义；3. 继承属性优先级低，易被显式声明覆盖；4. !important极大提升优先级，但应慎用；5. 层叠顺序决定最终表现，作者样式中后写规则…

样式不生效主因是层叠覆盖。1. 优先级：内联 > ID > 类/属性/伪类 > 标签/伪元素；2. 同优先级后定义者生效；3. 非继承属性需显式设置；4. !important虽高但慎用。查开发者工具划掉项可快速定位问题。 某些CSS属性不生效，往往不是写错了，而是被其他样式规则覆…

使用CSS transition 可让页面元素的颜色、大小、位置等变化更平滑，提升用户体验。关键在于合理设置过渡属性、时间与缓动函数，并避免性能问题。应明确指定需过渡的属性，如 opacity、transform、width、background-color 等，推荐写法为 transition: …

transform属性通过rotate、scale、translate实现旋转、缩放、位移，可组合使用并配合transition或animation创建高性能动画，默认以中心点为变换原点，可通过transform-origin调整。 CSS 的 transform 属性是实现元素视觉变形的核心工具，…

使用background-image与-webkit-background-clip: text结合可实现文字渐变效果，核心是将渐变背景裁剪至文字区域并设文字填充色为透明，现代浏览器支持良好，建议提供纯色回退并用@supports增强兼容性。 可以使用CSS实现文字渐变效果，虽然CSS没有直接的te…

letter-spacing 调整字符间距，适用于所有字符，常用于标题排版；word-spacing 控制单词间距离，主要影响英文单词，两者结合可提升文本可读性与视觉效果。 letter-spacing 和 word-spacing 都是CSS中用于控制文本间距的属性，但它们作用的对象不同，效果也有…