草庐IT

box-left-mini

全部标签

html - 为什么 'clear:left' 也正确清除?

我一直在努力让CSSfloat工作(在我的脑海中)。注意下面的例子:div.container{width:500px;}div.left{float:left;clear:left;}div.right{float:right;}leftdata1leftdata2rightdata1rightdata2rightdata3rightdata4这将给出以下输出:+--------------------------------------------------------------------+|leftdata1||leftdata2rightdata1rightdata2ri

CSS:如果垂直空间可用,则为 "float:bottom"。 "float:left"否则

我有两个非常窄(宽度:400像素)的div,如果浏览器窗口中有足够的垂直空间,它们应该垂直堆叠。如果浏览器高度太小,而右边有足够的空间,“bottomdiv”应该float到topdiv的右边。从某种意义上说,我要求的是“float:left”的反义词。float:如果浏览器窗口中有足够的水平空间,则水平左对齐div,如果下方只有可用空间,则仅将divfloat在其他下方。感谢您的任何建议! 最佳答案 根据您需要的浏览器支持级别,一个简单的媒体查询可能会解决您的问题:/*SETTHEDEFAULTRULESFORSHORTSCREE

html - padding-left 和 padding-start 有什么区别?

在检查一些代码时,我发现了这个新声明:-webkit-padding-start但我无法理解与现有的padding-left有什么区别属性(property)。我已经阅读了MozillaDevelopers上的页面并创建了一个fiddle,但我仍然不确定。 最佳答案 除了-webkit-padding-start是非标准的,不同之处在于当书写方向是从右到左时,-webkit-padding-start将填充放在右(有效地,转换为padding-right)。如果该属性是标准化的,它将对旨在用于包含不同书写系统文本的文档的样式表很有用

html - 如何在不破坏包含元素高度的情况下在 div 中使用 "float: left"?

float的HTML元素似乎不会扩展其容器的高度。例如,考虑以下代码:.portfoliosite{background:#777;padding:10px;width:550px;}.portfoliothumbnail{background:red;margin:010px10px0;float:left;height:150px;width:150px;}AwesomeSite.ComAnawesomesiteIdid.ItlaunchedonJan1,2009请注意灰色背景的包含div比红色div短,并且红色div延伸到容器边界之外。我希望包含元素扩展到其内容的大小,包括flo

html - 溢出(滚动)以使用负 `left` 和 `top` 定位元素

允许可滚动溢出的元素从左侧和顶部负向定位的解决方法是什么?赞hereinexample(jsFiddle),只有3个红色方block可见,并且未切换滚动。虽然有6个正方形,但其中3个位于顶部的负方向。 最佳答案 我能想到的唯一方法是将正方形包裹在一个与它们高度相同的div中,并使用JQuery的scrollTop()方法:http://www.w3schools.com/jquery/css_scrolltop.asp但这也会在包装器div下面强制设置一个水平滚动条...简短的回答:没有纯CSS解决方案,并且定位它们绝对避免了此解决

html - IE11 - border-radius 和 box-shadow 一起导致问题

遵循我的代码:div{display:block;width:500px;height:200px;border:1pxsolidblack;border-radius:5px;transition:box-shadow1s;}div:hover{box-shadow:25px25px0px#000;}Test它可以在Chrome、Safari和Firefox上运行,但在InternetExplorer11上运行不佳,当div不再聚焦时会出现明显的视觉问题。如何解决?JSFiddle:https://jsfiddle.net/aL0t8g21/ 最佳答案

html - 使用 box-sizing 创建内边框

我想创建一个HTML表格,其中每个单元格都是可点击的,点击一个单元格会在单元格内的单个div上添加一个边框。我希望div的边框完全存在于包含它的td的现有范围内,根本不需要调整表格或其单元格的大小。我似乎无法让这件事正确发生。这previousquestion似乎解决了同样的问题,并指向一些关于box-sizingCSS选项的文章。我有一个fiddle,我试图实现它但没有成功:http://jsfiddle.net/YsAGh/3/.*{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-

javascript - 在 box-shadow 上使用边框半径

下面代码的结果是这张图片:问题是不是所有的Angular都有边界半径。这是因为父级具有最大宽度,而border-radius仅适用于跨度的末端。有解决办法吗?也许与JS?要检测每条新线并添加另一个带有边界半径背景的跨度?由于响应能力,我无法在跨度中添加中断。在桌面版上,它是一长行。h1span{background-color:#272e3a;-webkit-box-shadow:20px00#272e3a,-20px00#272e3a;box-shadow:20px00#272e3a,-20px00#272e3a;padding:5px;border-radius:4px;font-

javascript - 如何在鼠标悬停时在 HTML 标记中的文本周围显示 "box"?

我正在为InternetExplorer编写BHO,我在其中搜索网页中的特定词并将在HTML标记中找到的词封装起来,以用于样式设置。我有代码可以在将鼠标悬停在标签上时更改样式属性,但我想做的是在单词周围显示一个“框”,但我不想将文本移动到它所在的任何其他位置原来的。为了说明,我制作了一张图片(想象一下“溢出!”这个词在它自己的HTML标签中):图片#1是之前,#2是鼠标悬停在单词上的时候!任何人都可以帮我提供有关如何解决此问题的任何建议吗?Javascript?CSS样式? 最佳答案 在要突出显示的文本周围引入一个标记,并连接onm

html - Firefox 中的 Padding Left 怪癖

http://jsfiddle.net/hERrX/input{padding:1%;}input#checking{padding-left:40px;}请在FIREFOX中检查以上链接并帮助我解决问题。它似乎在Chrome中运行良好。padding-left似乎不起作用,即使它具有更高的优先级。 最佳答案 如果您不使用%长度,它会起作用:http://jsfiddle.net/hERrX/15/input{padding:5px;}input#checking{padding-left:40px}我不知道为什么它不适用于%..我