css的强大之处

最新推荐文章于 2026-01-03 21:59:22 发布

原创最新推荐文章于 2026-01-03 21:59:22 发布 · 448 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#css #ie

DEMO制作专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一种在不同浏览器（IE与Firefox）中实现CSS自动换行的方法。使用word-wrap:break-word;overflow:hidden;可在Firefox中实现换行，但IE不支持。最终通过white-space:nowrap;解决了兼容性问题。

前几天项目开发中遇到了一个关于css自动换行的问题，是用li排的，而且要求靠内容自动去拉伸，要兼容ie与火狐。在网上找了很久，
大部分的解决方案如下：
word-wrap:break-word;overflow:hidden;

这样做，FF确实可以实现自动换行，可是在ie下却没有效果，继续查找，最后问题终于得到了解决，解决方案如下：

white-space:nowrap;（默认处理方式。文本自动处理换行。假如抵达容器边界内容会转到下一行）

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

M4A1007

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

最强大的 CSS 布局 —— Grid 布局

每天都要努力学习哦~~

09-30

1万+

应该注意的是，当我们定义网格时，我们定义的是网格轨道，而不是网格线。一般而言，是从左到右，从上到下，1，2，3 进行编号排序。一些常见的 CSS 布局，如居中，两列布局，三列布局等等是很容易实现的。：可以简化重复的值。布局是将容器划分成了“行”和“列”，产生了一个个的网格，我们可以将网格元素放在与这些行和列相关的位置上，从而达到我们布局的目的。上面例子的始终都是三列的，但是需求往往希望我们的网格能够固定列宽，并根据容器的宽度来改变列的数量。上面看到的效果中，右侧通常会留下空白，这是我们不希望看到的。

Sass详解：CSS预处理器的强大之处

qq_43341279的博客

05-12

690

Sass的代码经过编译后，会生成标准的CSS文件，浏览器可以正常解析和应用这些样式。Sass，全称为Syntactically Awesome Style Sheets，是一种CSS预处理器，它扩展了CSS的功能，提供了变量、嵌套规则、混合（Mixins）、函数等强大的编程特性，使得开发者能够编写更加模块化、易于维护和可重用的样式表。本文将详细介绍Sass的基本概念、特性、安装与配置，以及如何使用Sass来编写高效、优雅的CSS代码。Sass作为一种强大的CSS预处理器，为CSS的开发带来了革命性的变化。

1 条评论您还未登录，请先登录后发表或查看评论

关于CSS样式规范问题，BEM的强大之处

政旻

03-12

1196

1.首先，CSS样式的规范性是大多数实际项目中所必须要求的。就个人经历而言，CSS样式规范化是值得重视的，这样很大成都上避免后期的代码重构。 2.就我个人的实际开发过程中，采用了各种方法来达到CSS样式规范化，但很明显效果都不是特别明显。 a.常见的就是所谓的驼峰命名 b.采用模块名为前缀达到区别其他模块，避免重复的效果。 3.后来，接触到BEM的CSS命名规范，才知道有多好用，接...

前端基础之CSS扫盲

trong_ 的烂笔头

02-27

7652

光使用HTML来写一个前端页面的话其实只是写了一个大体的框架, 整体的页面并不工整美观, 而CSS可以在HTML的基础之上将页面优化的非常好看, HTML只是描述了网页的结构和有什么内容(也就是让网页有了 “骨”), 而CSS可以自由的设置网页的布局和样式(包括大小/位置/字体/颜色/背景等), 可以让网页的内容充实起来(让网页有了 “皮和肉”), CSS也叫层叠样式表, 一个元素可以运用多组样式, 有多层叠加的效果.

css之transform-origin

07-07

1561

是 CSS 中的一个属性，它允许你改变一个元素变形的原点。默认情况下，变形的原点位于元素的中心点，即50% 50%（或 center center）。但是，通过使用属性，你可以将变形的原点移动到元素上的任何位置。

CSS之flex布局

weixin_45604020的博客

06-30

5409

和浮动一样都用于网页布局，但flex比浮动要更强大。flex不会产生脱标现象，布局网页更灵活、更简单（推荐使用）。弹性容器+弹性盒子+主轴+侧轴。

强大CSS3可视化代码生成器

luck332的专栏

04-26

3221

DIY可视化CSS可视化代码生成器是一种工具，它允许用户通过图形界面直观地创建和编辑CSS样式，然后自动生成相应的CSS代码。提供了各种CSS3效果的生成器，如渐变、阴影、动画等。用户可以通过调整滑块和参数来预览效果，并获取生成的CSS代码。提供了强大的CSS可视化编辑功能，用户可以在编辑器中直接调整元素的样式，并立即看到更改的效果。提供了CSS动画的创建和编辑。用户可以选择预设的动画效果，然后调整参数以达到想要的效果。同时提供了丰富的预设样式和效果供用户选择，同时也允许用户自定义样式以满足特定的需求。

Css-Grid布局(强大)

qq_57404736的博客

12-10

6634

Css强大的Grid布局详细讲解使用

selenium之css定位详解

王大傻的博客

02-22

8567

css定位 css概述： 1、css（Cascading Style Sheets）是一种语言，它用来描述HTML和XML的元素显示样式。 2、css语言中有css选择器，在selenium中也可以使用这种选择器来进行元素定位。 3、css定位方式比xpath快，而且css的语法也非常强大，所以非常推荐这种方式定位。 css定位策略（方式）： 1、id选择器 2、class选择器 3、元素选择器 4、属性选择器 5、层级选择器 css定位方法：find_element_by_css_selector() 1

前端知识——css之flex布局

最新发布

HANhylyxy的博客

01-03

600

结论弹性布局是现代CSS中最实用的布局工具之一。通过掌握弹性布局，你可以轻松解决传统布局中的难题，创建出灵活、响应式的界面。虽然它只是CSS布局生态系统的一部分（与网格布局、多列布局等并存），但在处理一维布局需求时，弹性布局通常是首选工具。开始在你的项目中实践弹性布局吧！从简单的导航栏到复杂的卡片布局，你会发现许多曾经棘手的布局问题现在都能迎刃而解。

cssTab卡片式

weixin_73251435的博客

12-30

526

代码//顶部tab切换部分<div</div></div>//下方块数据部分</div></div>css部分.tab {&-item {&:before {left: 100%;

什么是margin重叠，如何解决

yydsdaydayup的博客

12-30

469

摘要：Margin重叠是CSS中垂直方向上相邻块级元素的外边距合并现象，只发生在标准文档流的垂直方向。主要解决方法是创建BFC（块格式化上下文），推荐使用display:flow-root属性，这是最安全无副作用的方式。其他方案包括设置padding/border隔离、使用flex/grid布局等。理解margin重叠是CSS规范的一部分，仅在影响布局时才需要干预。

每日前端面试题-css塌陷

m0_61933248的博客

01-02

175

这里强调一点，只有父子元素的外边距塌陷问题才是因为子元素影响到了父元素的外边距，也就是影响了父元素的外面，所以才能让父元素成为一个BFC的方式解决这个问题。同时设置margin-bottom和margin-top，此时这两个元素本身的外边距就是设置的值，但是实际生效的外边距是这两个值中的较大者，也就是说两个盒子的真实的外边距不是margin-bottom和margin-top的和。就会选择外边距中较大的一个生效。原因：父元素没有设置高度，它的高度是由子元素撑开的，如果子元素设置浮动，父元素的高度就为0。

CSS 相对定位与绝对定位

qq_44967213的博客

12-29

775

相对定位“我在原地，但看起来挪了位置”—— 用于微调或作为定位上下文；绝对定位“我飞出去了，贴在某个容器的某个角落”—— 用于精确覆盖和悬浮布局。两者经常配合使用：父元素，子元素，这是前端布局的经典组合！