草庐IT

display_width

全部标签

html - 什么是最小宽度 : 100%; width: auto actually do?

我在CodePen上找到了一个很好的全屏视频示例:https://codepen.io/dudleystorey/pen/knqyK我很难理解以下样式:video{min-width:100%;min-height:100%;width:auto;height:auto;}为什么我们不能只指定最小宽度和最小高度?为什么我们需要将宽度和高度设置为自动? 最佳答案 min-width:100%确保元素至少与其容器一样宽。width:auto允许元素保持其原始大小。所以两者的结合可以理解为“让元素占据它需要的空间,除非它小于它的容器的宽度

javascript - jQuery .width() 和 .height() 奇怪的行为

为什么在followingcode.height()返回95而不是100,而.width()按预期返回200?我使用Firefox3.6.3。HTML:CSS:#my{border:5pxsolidred;}JS:$("#my").width(200).height(100);$("#log").append("Width="+$("#my").width()+"");$("#log").append("Height="+$("#my").height());我尝试了.outerWidth()和.outerHeight()以及.innerWidth()和.innerHeight(),但

html - 放显示:inline element inside nested display:block element doesn't work?

看这个例子:http://jsfiddle.net/aLrfmyqm/p{display:inline;}em{display:block;}OuterinlineBlockInnerinline我希望Innerinline与Block内联,但是,它在一个新行中开始。有人对此有想法吗?谢谢! 最佳答案 您的标记无效。你不应该嵌套p里面的元素p元素,因此是问题。来自W3C:ThePelementrepresentsaparagraph.Itcannotcontainblock-levelelements(includingPitsel

html - <span style ="display:inline-block"> 后防止换行

在HTML叙述流中的元素,为了扩大检测到点击的区域(一些跨度只有一个字符的内容),我在定义为.expand-click-area{display:inline-block;padding:5px;margin:-5px;position:relative;}这在点击行为方面效果很好。问题在于,在以下情况下,Chrome19有时会在span和后面的逗号之间换行:thisisspantext,关于如何防止这种情况的任何想法?本质上,我想打破与时相同的行为根本不存在,或者没有display:inline-block.这种行为在IE10中似乎没有出现。在http://jsfiddle.net/

html - CSS: 'display' 属性的无意义值会导致问题吗?

我使用的CMS允许带大括号的数据占位符,如下所示:Name:{First_Name}Email:{Email}Phone:{Phone}但是它没有给我任何方法来进行条件输出,比如如果电话字段为空我就无法隐藏电话线。CMS不允许javascript或服务器端代码。我想到了这个技巧:Name:{First_Name}Email:{Email}Phone:{Phone}如果此人没有电话号码,div最终显示为:无,但如果他们有,div最终显示一个无意义的值,并且显示整个div。它适用于IE8、IE9、FF14、Chrome我有什么理由不应该这样做? 最佳答案

html - 使用 max-height 和 max-width 垂直居中图像

我有以下html代码:使用这些样式,宽度大于400像素的图像会调整大小但仍保留在div的顶部。有没有办法让它们垂直居中? 最佳答案 CSS:div{border:3pxsolidcoral;width:400px;height:400px;background:#d4d0c8;line-height:400px;text-align:center;}img{max-width:400px;max-height:400px;vertical-align:middle;}参见demofiddle.

html - Min-width, max-width css 使用最小宽度

好的,所以我希望做的是创建一个DIV,它会根据其中的内容自动调整大小,但它应该使用尽可能小的宽度。我不知道如何做到这一点。所以,如果我有一个包含3个字符的DIV标签,这无疑小于200px宽,那么我想要的是div为200px。如果有更多文本,我希望它自动调整大小,以便文本适合。**仅使用***CSS*这可能吗?******更新**让我看看是否可以更好地解释这一点。我有一个DIV:+++++++++++++++++++++++++++++++++|-------------------------------||-----textthislongertext-----||---------

javascript - Google Charts : Line Chart: Doesn't display in IE and Firefox, 但适用于 chrome

我有一个简单的图表(尽管包含大量数据),它在chrome中呈现良好但在IE或Firefox中无法呈现。由于我对网络开发知之甚少,所以我不知道如何找出问题所在。谁能帮我弄清楚哪里出了问题,也许可以解释一下他们是如何弄清楚的?google.load("visualization","1",{packages:["corechart"]});google.setOnLoadCallback(drawChart);functiondrawChart(){vardata=newgoogle.visualization.DataTable();data.addColumn('datetime','

jquery - .width() 函数没有返回正确的值

我正在尝试使用.width()通过jQuery动态访问元素的宽度。在开发人员工具中,我可以看到元素的宽度为37.333Px,而.width()给出38.33334Px。开发者工具中的宽度宽度来自.width()在这种情况下差异是1px,但有时差异是小数。为什么会有这样的差异?我哪里错了?有没有其他的可以得到精确的宽度。 最佳答案 我们可以通过下面列出的几种方法来获取宽度,width()-设置或返回元素的宽度innerWidth()-返回元素的宽度(包括填充)outerWidth()-返回元素的宽度(包括填充和边框)。outerWid

文档准备好后 jQuery width() 立即不正确?

由于某些原因$("...").width()在文档准备好后立即返回错误值。我看到了这些值:文档准备好后立即:$(document).ready(function(){$("li.activea").width()//returns76-incorrect});$(document).ready(function(){$(window).load(function(){$("li.activea").width()//returns59-thecorrectvalue});});$(document).ready(function(){setTimeout(function(){$("l