JQuery用户界面主题：没有窗口小部件正确显示 [英] JQuery UI Theme : No Widgets Display Correctly

问题描述

免责声明 - A *是指地方在那里我不能发布我想要的东西，因为这是我第一次张贴在堆栈溢出，所以反而我解释什么，我想展示。 ：）

Disclaimer - A * denotes somewhere where I wasn't able to post what I wanted, since this is my first ever post on stack overflow, so I instead explain what I wanted to display. :)

我似乎有与jQuery UI的得到一个推出的主题才能正常工作的问题。首先，当我打开它看起来像这样的下载提供的示例文件。

I seem to be having a problem with getting a rolled theme from Jquery UI to work correctly. First when I open the example file given in the download it looks like this.

在长相一般碾碎一切都像，像没有任何填充，边距，边框等。

Everything in general looks scrunched up like that, like there isn't any padding, margins, borders, etc.

下一个图像jQueryUI的基本主题，底座/ all.css被我的网站上实现的。

The next image is JQueryUI base theme, base/all.css being implemented on my site.

看起来是正确的，但它不是我想要jQueryUI的样子。下面，我正在试图实现主题的主题/ jQuery的-ui.css，而不是基础，我得到了相同的结果的例子。

Looks correct, but it's not what I want JqueryUI to look like. Below, is me trying to implement the theme theme/jquery-ui.css instead of the base and I get the same result as in the example.

*我本来想包括一个链接到我的网站上正在实施的主题，但我没有足够的声誉，包括2个以上环节。不管怎么说，它看起来完全一样的，因为它看起来如何在示例HTML

*I had wanted to include a link to the theme being implemented on my site, but I don't have enough reputation to include more than 2 links. Anyways, it looks the exact same as how it looks in the example html.

奇怪的是，当我滚动网站上的一切主题的外观如何我希望它。仅供参考，以我的主题，这里是链接到它。

The weird thing is when I am "rolling" the theme on the website everything looks how I would expect it to. For reference to my theme, here is the link to it.

*好了另一个谎言没有联系，但即使下载从辊图库我得到同样的揉了结果的jQuery UI的主题之一。

*Ok another lie no link, but even downloading one of the Jquery UI themes from the roller gallery I get the same scrunched up results.

我想知道如果我只是误解如何使用主题？我的理解是，你只需更换与客户的jQuery-ui.css的all.css。在这两个我在下载的时候每一个部件可能的选择。

I'm wondering if I'm just misunderstanding how to use the theme? My understanding is you can just replace the all.css with the customer jquery-ui.css. In both I have every component possible selected when downloading.

推荐答案

好了，所以我能解决我自己的问题，它实际上是由于对堆栈溢出另一个答案。本质上，它是ASP.NET MVC一个捆绑的问题，我不能完全理解你应该如何使用的主题。第一件事首先这里是我的包原来的样子。

Ok so I was able to solve my own problem, and it was actually thanks to another answer on stack overflow. Essentially it was a bundling issue in ASP.NET MVC, and me not completely understanding how you are supposed to use the theme. First things first here's what my bundle originally looked like.

            bundles.Add(new StyleBundle("~/Content/jqueryui").Include(
            "~/External/Content/themes/base/all.css",
            "~/External/Content/themes/green/jquery-ui.css",
            "~/External/Content/themes/green/jquery-ui.structure.css",
            "~/External/Content/themes/green/jquery-ui.theme.css"
            ));

由于这个答案，我决定检查中，它实际上是显示在网页上的顺序（在事后我应该做它第1名）。 如何配置MVC的风格捆绑秩序？这帮助我找出确实的主题是第一，然后渲染base.css尽管这不是他们在包的顺序。

Thanks to this answer, I decided to check the order in which it was actually rendering on the page (which in hindsight I should have done it the first place). How do I configure MVC's style bundling order? This helped me find out that indeed the themes were rendering first and then the base.css even though that's not the order they were in the bundle.

所以我打出base.css成为一个显式调用之前包（也移除了束base.css），并且一切都工作正常！这是它是如何在我的页面布局的头标记。

So I split out the base.css into an explicit call before that bundle (also removed the base.css from the bundle), and everything worked perfectly! This is how it is in the head tag of my Layout page.

@Styles.Render("~/External/Content/themes/base/all.css")
@Styles.Render("~/Content/jqueryui")

所以两件事与使用ASP.NET MVC，首先捆绑顺序（见它显示在网页上什么样的顺序）一个jQuery UI的主题时检查，如果你不知道使​​用base.css（或其主题是一起选择要使用的元素的CSS），那么做！

So two things to check when using a JQuery UI theme with ASP.NET MVC, first the bundling order (see what order it's rendering on the page) and if you didn't know to use the base.css (or the select element css you are using) along with the theme then do that!

这篇关于JQuery用户界面主题：没有窗口小部件正确显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！