如何更改命名div内的嵌套div显示为显示内联使用CSS或jQuery选择器？

我有一个问题，我需要能够改变一系列的div使用“显示：内联”的基础上，如果他们嵌套在一个特定的div，但我不能确定如何选择所有的子div 。也许有一个简单的CSS方法来实现这一点，但我会更详细地描述问题。如何更改命名div内的嵌套div显示为显示内联使用CSS或jQuery选择器？

我有一个使用控件套件的Web应用程序，我没有编程访问来更改控件使用的类/结构，但是最终它们输出HTML，JavaScript等，并且使其进入DOM。该套件将控件包装在一个div中，该div被解释为一个块div（因为没有指定display：值），这会在控件旁边显示图像或图标的情况下导致问题。一个帮助图标，因为div默认呈现为块而不是串联。该网站的其余部分仍然需要将div视为块。

有没有什么办法让添加的div添加style =“display：inline;”所有它试图通过jQuery或CSS包装的项目？

在下面的例子中，所有内/下方ctl00_ContentPlaceHolder1_Area一般需要的div被改变为具有显示：内联，但是更具体的div开始ctl00_ctl00_ContentPlaceHolder1_ *和是命名ctl00_ContentPlaceHolder1_Area在div内。

<div id="ctl00_ContentPlaceHolder1_Area"><div id="ctl00_ctl00_ContentPlaceHolder1_TextBox1Panel"> 
     <input name="ctl00$ContentPlaceHolder1$TextBox1" type="text" onchange="javascript:setTimeout('WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$ContentPlaceHolder1$TextBox1", "", true, "", "", false, true))', 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;javascript:$radIE.keyPress(event);" id="ctl00_ContentPlaceHolder1_TextBox1" class="RadInputMgr_Office2007 RadInput_Enabled_Office2007" onmouseover="javascript:$radIE.mouseOver(event);" onmouseout="javascript:$radIE.mouseOut(event);" onblur="javascript:$radIE.blur(event);" onfocus="javascript:$radIE.focus(event);" /> 
    </div> <img src="icon.png" alt="Small Image Icon"></div>

来源

2011-03-14 jon333

需要'ctl00_ctl00_ContentPlaceHolder1_TextBox1Panel'作为id。另一方面，你应该可以用CSS来做到这一点。 – thirtydot 2011-03-14 20:10:07

尝试：

#ctl00_ContentPlaceHolder1_Area div[id^="ctl00_ctl00_ContentPlaceHolder1_"] { 
    display: inline !important 
}

如果可行，请查看它是否在没有!important的情况下工作，这是不好的做法。

演示：http://jsfiddle.net/thirtydot/RGAm8/

来源

2011-03-14 20:12:49 thirtydot

如果你有一个选择，你可以使用（理想的是类名，或别的东西），jQuery将让你做这样的事情

jQuery('.DIV_CLASS').each(function() { jQuery(this).css('display','inline') })

或者，假设他们是另一个DIV的一部分，CSS：

div.container_div div { display: inline; }

来源

2011-03-14 20:12:04

如果你没有任何容器内的其他div的，你可以使用下面的CSS：

#ctl00_ContentPlaceHolder1_Area div { 
    display: inline; 
}

来源

2011-03-14 20:15:03

我将一个类添加到父DIV，然后使用像这样的css

div.parent > div { display:inline; }

这只适用于父div的子级的嵌套div。换句话说，div 2将被内联显示，但div 3不会。

<div class="parent" id="1"> 
    <div id="2"> 
    <div id="3"></div> 
    </div> 
</div>

来源

2011-03-14 20:34:05 agradl

如何更改命名div内的嵌套div显示为显示内联使用CSS或jQuery选择器？

回答

相关问题