How to CSS style AngularJS directive?

Question

Assuming I have a directive \"mydirect\" with a template that contains a lot of divs with a lot of nested classes. For example:

Answer 1

Angular Directive with Custom CSS.

app.directive('bookslist', function() {

    return {
    	scope: true,
        templateUrl: 'templates/bookslist.html',
        restrict: "E",
        controller: function($scope){

        },
        link: function(scope, element, attributes){
        element.addClass('customClass');
      }

    }

});

.customClass table{
	!background: #ffffd;

}
.customClass td{
	border: 1px solid #ffffd;

}