草庐IT

floating-point-conversion

全部标签

html - float : left; ambiguity - CSS

以两张图片为例与float:left;没有float:left;HTMLSignUpCSSh6:before{content:url("images/arrow.png");padding-right:8px;float:left;//Hereliesproblem}问题为什么没有float:left;text(Signup)下降?这背后的科学原理是什么? 最佳答案 伪元素默认的显示方式是display:inline;,默认的垂直对齐方式是vertical-align:baseline;。这意味着图像将与文本的基线对齐。当您floa

html - CSS page-break-after 和 float 不能很好地播放?

如果我有以下HTML代码:Testhellotherebilbobaggins我想在每一页上打印一个单词,每一个单词之后有一个分页符。(这是简化的代码-在我的实际网页中,float很重要。)Firefox可以很好地打印,但IE和Safari都将它们全部打印在一页上,忽略分页符。这是那些浏览器中的错误吗?有更好的方法吗?谢谢。 最佳答案 是浮标在打印时弄乱了它。你需要那里的花车来打印吗?还是仅网络需要float?为什么我要问的是你可以为不同的媒体(打印、屏幕)设置不同的CSS类http://www.w3.org/TR/CSS2/med

html - CSS 3 列 float (2 个固定,1 个动态)

我正在设计一个由3个部分组成的页眉。页面必须是流畅的:min-width:940px;最大宽度:1200px;标题的前两部分将是固定大小的:leftmiddleright134px183px(Filltheremainingspace)我想根据页面的大小更改正确的部分,我将粘贴到目前为止的内容,但我的问题是如何让它完全填补空白。HTML:CSS:.main{margin:auto;min-width:940px;max-width:1200px;background-color:#000;}.left{float:left;width:134px;height:191px;backgr

html - float 图像周围具有最小列宽的流动文本

我想要一种方法来防止流动文本的列变得太窄。例如,在一列HTML文本中,有一张图片向左浮动。正如预期的那样,文本沿着图像周围列的右侧向下流动:但是,如果图像几乎与列一样宽,那么文本最终会变得非常窄:在这种情况下,我希望文本简单地不流过图像,而是落在图像下方,就好像图像是一个block:我正试图找到一种简单而通用的方法来做到这一点。这是一个博客——我希望能够添加图像和文本,也许添加一个类或粘贴一些标记(叹气),并让流程工作。我宁愿只用CSS和HTML来做,因为很难将JavaScript插入到博客文章中。我有几种方法(请参阅我的答案),但都不令人满意。你能做得更好吗?

html - float div 上的框阴影

我在floatdiv上渲染框阴影时遇到问题!我在chrome和firefox中测试了相同的结果。编辑:顶部的div没有在下面的div上渲染它的阴影,是否有任何解决此问题的方法,或者我是否必须尝试其他解决方案?问候/乔尔 最佳答案 我在Firefox4中工作,但该代码永远不会在chrome或safari上工作,-moz是表示mozilla的供应商标签。您需要添加以下所有内容-moz-box-shadow:0px8px8px#000;width:200px;-webkit-box-shadow:0px8px8px#000;width:2

html - css 内联 block 与 float

我正在对float和inline-block进行一些测试,我注意到它们之间存在差异。从THISEXAMPLE可以看出,如果我使用display:inline-block,div之间会有一点空白,但如果我使用float:left,它会按预期工作。请注意,我使用的是EricMeyer的ResetCSSv2.0。是因为我做错了什么还是inline-block的行为方式(在那种情况下它不是很可靠)。HTMLHowpadding/marginaffectfloatsCSS(无重置)#wrap{width:600px;margin:auto;}.square{width:200px;height:

css - 如何阻止 <div> 在定义了 float 的情况下相互移动?

非常简单的CSS问题,到目前为止我还没有找到答案:我正在尝试布置一个页面,其中两个div并排排成一行(使用float:left;和float:right;),然后在它们下面放置一个div。问题是,如果顶行(定义为一个div本身)太宽以至于两个div之间的空间可以容纳底部的div,则底部的div向上移动到顶行,从而产生一行三个div的外观.我不知道这是否清楚,但这是代码:因此,如上所述,由于顶部div在其左右子元素之间有200像素的间隙,因此底部div中的图像在它们之间向上滑动。如果我将顶部div的宽度设置为399px,那不会发生。我尝试使用CSS“clear”属性,但这并没有解决问题。

css - float :right divs appear on next line in IE only

好的,所以在开始编写Web应用程序代码之前,我正在制作我的UI原型(prototype)。我在Firefox中工作时完成了大部分设计,(当然)当我在IE中测试它时,存在很多渲染问题。其中一个问题是,如果我有一个包含一些文本的div和另一个设置为float:right的div,则嵌套的div会显示在下一行,在其父div下方。这是最简单形式的问题标记...TextRight我在互联网上搜索解决方案,我发现唯一可行的相关解决方案使它在IE中工作是将floatdiv放在其父级的开头,如下所示...RightText实际上,嵌套的div有一个类,我的CSS是float的那个类。但是,如果我最终制

javascript - 使用 CSS 的动态 float 布局

让我试着解释一下我想要实现的目标。我想要具有特定宽度(250像素)设置但动态高度的X框放置在正文中。但我希望它们尽可能紧凑,它们之间没有不必要的空白。现在如果所有的盒子都有相同的宽度和高度,这会很容易。例如,我可以将float:left;放在它们上面。但是当盒子高度是动态的,并且所有盒子都有随机高度时,我最终会在盒子之间留出空间。让我举两个例子:这就是我想要的:这就是我最终得到的:这是我的CSS:框的HTML示例:Header0Eratvolutpat.Sedrutr...完整源代码:http://pastebin.com/UL1Nqyvm有没有办法用CSS实现这一点?感谢您的帮助或指

html - CSS:对齐两个元素,在同一行中左右对齐,没有 float

我试图对齐两个内联元素,一个在左边,一个在右边。我想在不使用float的情况下完成此操作。在我的例子中,我有一个h1,带有一个span和一个链接。我希望跨度向左对齐,链接向右对齐。http://jsfiddle.net/Lkfacta3/h1>span{text-align:left;}h1>a{text-align:right;}Alignmeleftalignmeright这是期望的结果: 最佳答案 你可以使用一些flexbox魔法:h1{display:flex;justify-content:space-between;}A