The Developer Brains


CSS3 @IMPORT RULES

Web Designing | Web Development


SEE MORE














</CSS3 @Import Rules>




What is an @import rule?

@import function is used to import CSS rules from another Style Sheets in HTML documents or it is used to add extra rules within CSS files. This function makes it possible to include external CSS files in a document.



SEE MORE




















</@import rules>

CSS @import is used to import CSS Rules from another Style Sheets


@import rule

Use of @import rule on Internal Style Sheet.
	
<style>
	@import url('style.css');
</style>
	
	

@import on external Style Sheet
	
	<style>
		@import '/tdb-style.css';
		@import 'https://fonts.googleapis.com/css?family=Lato';
	</style>
	
	

This code will import a CSS file named tdb-style.css and a font family from the specified google font's link.



<!DOCTYPE html>
<html>
<style>
	@import url('style.css');
</style>
<!--Body-->
<body>
	<button type="submit" class="tdb-school">
	Press
	</button>
</body>
</html>


Try it Yourself
















Which is the correct way to apply @import rule?

1. @import '<style>/tdb-style.css</style>';
2. @import '/tdb-style.css';
3. @import '{color:red;}';
4. @import '<style>{color:red;}</style>';




Check Now



CSS3 QUIZ







Next: Structure of Cascading Style Sheet


Previous

      

Next Page













  Share TDB SCHOOL  

Share this E-Learning Website on social media platforms with your friends and followers