How to Add Custom CSS and JS files to Your Visual Web Part

Adding CSS

1. Add "Layouts" mapped folder to Visual WebPart Project.

2. Create a folder structure layouts/styles/themable

3. Add the css file to the styles folder .If you are using themable styles then also add it to themable folder too

4. Register the CSS file by adding following line into your visual webpart

<SharePoint:CssRegistration ID="cssId" name="/_layouts/projectName/cssName.css" runat="server" />

http://msdn.microsoft.com/en-us/library/microsoft.sharepoint.webcontrols.cssregistration.aspx

(Note: Another approach From sharepoint designer add css file to style library and refer it in css registration)

Adding JS

1. Add "Layouts" mapped folder to Visual WebPart Project.

2. Add you JS file to layout folder or your project specific folder

3. Add the script link to your webpart

<SharePoint:ScriptLink ID="scriptLinkId" name="ProjectName/jsFileName.js" runat="server" />