I am relatively new to website design and specifically working in ASP.NET, i am using CSS to style my site, but when i use ASP.NET Controls like GridView, Navigation controls, etc ...
they are messed up by the style sheets, and you can't see that until you run the website, because the controls are translated to HTML and so affected by CSS in a way that you can't predict, how to solve this, and is there a better way to layout and desgin sites in ASP.NET.
You can use ControlAdapters or better use ASP.NET MVC
A great method that's worked well for me is to create Skins for your ASP.NET controls.
http://msdn.microsoft.com/en-us/library/ykzx33wh.aspx
http://www.asp.net/web-forms/videos/how-do-i/how-do-i-use-skins-with-css-for-a-flexible-and-maintainable-aspnet-web-site
After getting my skins and CSS classes created for the different pieces of my ASP.NET controls I'll then run my app in a browser with good developer tools, Google Chrome has a stellar set of dev tools that allow you to modify your css classes and styles right in the page so you can see the results immediately. I'll then update my Skin CSS classes to match the styles I created using the browser dev tool.
Related
You can specify CssClass in server controls and your ASP.NET page will generate the style attribute for the control.
You can also specify an external CSS file in the ASP.NET page just as you would in an ordinary HTML page.
You can also write a tag in the ASP.NET page header section just as you would for an ordinary HTML page.
Then why are ASP.NET Themes necessary?
Don't confuse ASP.NET Themes with ASP.NET Skins. I've explained them here:
The Theme system in ASP.NET does not compete with CSS, instead it's a system that's meant to make it easier to allow users to choose the stylesheets that are applied to the site.
The idea being that you'd create a "BoringBlue.css" stylesheet and associated artwork, then make a few changes and create a new one called "HotPink.css". Rather than doing the work to generate the markup that enables or disables the page's style <link> elements ASP.NET Themes will do this heavy lifting for you.
However, ASP.NET Web Forms Web Controls were originally made during the IE6 love-in at Microsoft (back when they pretended Firefox didn't exist, so this is around 2004-2005) so they don't make heavy use of CSS, many controls render presentational attributes, such as bgcolor. "ASP.NET Skins" are a way to control the colors and other presentational settings of WebControls (note, not HtmlControls). ASP.NET Themes provide you with a way to choose which ASP.NET Skin is also applied, in addition to CSS stylesheets.
Note that under ASP.NET MVC, Themes and Skins are completely obsolete as the framework no-longer renders any complex markup, returning complete control to the developer. Finally, no more gimmicks - I haven't really come across a "let the user set the color scheme"-site since people stopped using phpNuke around 2007.
Is it possible to change the default template of each ASP.NET server control? In WPF and Silverlight, each control is supposed to be lookless, so the developer can provide a user-defined control template to change how the control looks. If, for example, I want to use an outer and inner square/rectangle other than an outer and inner circle in a RadioButton, how do I accomplish that?
Don't have much experience with ASP but we used to work with Prado a lot (a PHP framework that behaves much like ASP .NET).
I would say the easiest thing to do is assign a CSS class to the component, which you should be able to do to any ASP .NET component and then simply use CSS to style the component.
At the end of the day, its all spat out to the browser as HTML anyway, so there's no real reason why you couldn't style it using CSS.
I recommend you don't use the standard CSS classes, unless you want all instances of a particular component to the look the same for your application.
We write a lot of Ajax apps and this is what we do.
ASP.NET has support for Themes and Skins. You can use a combination of skins and CSS (packaged up into a theme for convenience) to apply some styles to your controls. However, different browsers on different operating systems may render various controls slightly differently (for example take a look at how radio buttons are rendered). I'm not sure how much control you'll have over that behavior.
i want to manage all the design of my website(asp.net) through my css.
my client requirement is he should be able to change all design of website within 4-5 hrs.
is this possible.
is there any trick to do this?
Sure it is. ASP.NET doesn't but render html, css and javascript. What you need it to let it render the html you're after and hook in css for layouting.
ASP.NET also provides you with some great functionality: Themes and skins. These make changing css, images, ... a snap by either configuration or setting a certain premaid theme in code. I suggest you take a look at these videos for more information:
Customize my Site with Profiles and Themes?
Create User Selectable Themes for a Web Site
Use Skins with CSS for a Flexible and Maintainable ASP.NET Web Site
That's a very tall order indeed. By design does the client mean the color/theme or also the layout?
Basically is boils down to the following:
1. Generate semantic html only from you ASP.NET code. That is no in-line style and use meaning full css class names for html that needs to be styled
2. Break your css files into two. One for style and layout and another for color. If you're using images, they should be a part of your color css file
You can start here but also be clear about what your client means by "should be able to change the design within 4-5 hours".
Yes this possible if you have good knowledge of CSS i.e. 2 and 3. Have look at below links which can provide you and idea about layouts fully dependent on CSS
Yui library
Yui CSS tools
Many more ideas like CSS sprite can be used to achieve what you need
I have several Silverlight component which are going to be used inside the browser, is it possible to pass the styling from the page to the Silverlight components?
I'm aware of 'initParams' in Silverlight and how these could be used to do this, but what I wanted to know is there any support for CSS and what is the preferred way to do styling in Silverlight, I guess it will be based around resource files.
Cheers
Ollie
There is no css support in Silverlight. In Xaml we have the Style element, which allows you to create styles and then apply them to controls. Here is a tutorial that explains the basics pretty well:
http://weblogs.asp.net/scottgu/pages/silverlight-tutorial-part-4-using-style-elements-to-better-encapsulate-look-and-feel.aspx
I want to style the asp.net membership login control and I am too lazy to handcraft a professional looking one.
I couldn't find ready made css styles for the login control. Are there any available on the web?
The easiest thing to do would be extend the look of your current style sheet. More than likely any style sheet found on the web would look out of place in the context of your site.
That being said if you want a clean looking starting point with a lot of good built in styles take a look at Google Blueprint specifically their form demo page.