Loading...

RE: How to add an external style sheet so that I can simply input the name of CSS class we created in-house

RE: How to add an external style sheet so that I can simply input the name of CSS class we created in-house

#5629
Anonymous
Anonymous
Participant

Hi

The best way to understand the element and name for changing the alternating item style background color is using Internet Explorer Developer Tool. Using modern browsers, hit F12 key to bring the tool up and investigate the HTML DOM structure (such as the DOM Explorer in IE Developer Tool). Click the arrow key button "Select Element (Ctrl-B)" to move your cursor to the alternating item line and click. Once you selected the alternating line, you should be able to see the CSS classes and styles applied to that element. This is also how we are able to provide the sample CSS class name and style to you.

You will have to come up with the exact CSS style that you wanted to replace the OOTB style we provided. The Developer tool allows you to directly make changes and see the effect. Once you are comfortable with the change, you can copy it and use them on your own. There are many resources online with regard to CSS style for color, font, background and etc.

To apply for CSS style change, you can either create separate stylesheet and upload it to the document library on your SharePoint site, then reference this file from your master page or individual Web Part page. Alternatively, you can apply it as in-line style by using OOTB Web Part such as HTML Form Web Part or Script Part (in SP2013) and copy/paste the custom CSS code in it to the page (in this case, the page containing your qListView). The alternative approach obviously only handles one instance of the need so it is not reusable like the separate CSS file approach but it is quick and efficient if you only want to change one page.