How angular defines css

Question

Angular defines some css classes like ng-hide and more. How and where it does it? in angular.js I've a possible definition:

 * ### Overriding .ng-hide
 *
 * By default, the `.ng-hide` class will style the element with `display:none!important`. If you wish to change
 * the hide behavior with ngShow/ngHide then this can be achieved by restating the styles for the `.ng-hide`
 * class in CSS:
 *
 * ```css
 * .ng-hide {
 *   /&#42; this is just another form of hiding an element &#42;/
 *   display:block!important;
 *   position:absolute;
 *   top:-9999px;
 *   left:-9999px;
 * }
 * ```

If it's really the definition, what's that ```css syntax? Found nothing about it.

I think the following question could help you stackoverflow.com/questions/13813254/… — Rishabh Malhotra
– Rishabh Malhotra, Commented Mar 5, 2015 at 15:10
You can disable this behavior in production setting the $compileProvider.debugInfoEnabled — Avraam Mavridis
– Avraam Mavridis, Commented Mar 5, 2015 at 15:22

Quentin · Accepted Answer · 2015-03-05 15:14:16Z

1

Angular defines some css classes like ng-hide and more.

No, it doesn't. Those are HTML classes.

There is no such thing as a CSS class. CSS has class selectors which allow you to apply styles to elements based on which HTML classes they are members of.

Angular uses HTML classes primarily to select elements with JavaScript, not CSS.

The few areas where it does use CSS can be found in the CSS directory of the source tree.

what's that ```css syntax?

That isn't CSS. It is markdown. It means "This is a block of code". You are looking at the source code to documentation. It will be parsed by markdown (and, presumably, a tool like JSDoc) and converted into HTML.

answered Mar 5, 2015 at 15:14

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Sign up to request clarification or add additional context in comments.

Comments

TZHX · Accepted Answer · 2015-03-05 15:18:13Z

0

You're looking at comments which are meant to be used as documentation, not the actual code.

If you scroll right to the bottom of the angular.js file, you'll see a line beginning with:

!angular.$$csp() && angular.element(document).find('head').prepend('<style type="text/css">@charset "UTF-8";[ng\\:cloak],[ng-cloak],[data-ng-cloak],[x-ng-cloak],.ng-cloak,.x-ng-cloak,.ng-hide{display:none !important;}ng\\:form{display:block;}</style>');

That's where the actual CSS is defined. There's not that much of it, and it's pretty much just limited to hiding things like this.

answered Mar 5, 2015 at 15:18

TZHX

5,40616 gold badges51 silver badges60 bronze badges

Collectives™ on Stack Overflow

How angular defines css

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related