Change Style of Document Library View Title Bar in On-Premise SharePoint 2013 Server

Suppose We have multiple document library view added as web part in a SharePoint Page. In order to fulfill client requirements, sometimes it is needed to change the look and feel of  SharePoint Document Library.

For this purpose, We need to add custom CSS by adding Content Editor Web Part just above the corresponding web part. In the content editor, we need to identify the Web Part id of particular zone web part and right down some css to change the view's title bar.


Following are the CSS:

<style type="text/css">
<span id="ms-rterangecursor-start" aria-hidden="true"></span>
<span id="ms-rterangecursor-end" aria-hidden="true"></span>

span#WebPartTitleWPQ10.js-webpart-titleCell 
{
    background: linear-gradient(lightskyblue, transparent);
}

</style>

Following screenshot shows the effect:

So, we can achieve the required style by adding custom CSS on the particular web part by means of adding Content Editor Web Part.


Happy SharePointing..........................:)