This article will show you how to safely insert your CSS for your WordPress plugin or theme into the HEAD section of both the WordPress front-end and administration panel.
Enqueuing your CSS into WordPress using the wp_enqueue_style function doesn’t focus as much on conflict as it simply allows a quick, efficient way of ensuring that your styles are loaded in the correct order. When you enqueue WordPress a CSS file, you may specify dependencies which tells WordPress that your CSS depends on another CSS file and should be loaded afterwards.
So where should you put this code? You can execute wp_enqueue_style when your plugin or theme file is loaded. For plugins, you can put it anywhere inside your main plugin file so that WordPress will execute wp_enqueue_style when your plugin is noticed/read initially. For a WordPress theme, you can execute wp_enqueue_style in your functions.php file.
<?php wp_enqueue_style($handle, $source, $dependencies, $version, $media); ?>
<?php wp_enqueue_style('mystyles', '/wp-content/plugins/myplugin/style.css', array('otherstyles', 'morestyles'), '1.0', 'screen'); ?>
Name of the stylesheet. This should be a unique string.
The absolute path to the stylesheet relevant to your WordPress root.
An array of other enqueued styles that this style depends on. The array should contain the
$handle values of the other stylesheets. If your stylesheet doesn’t have any dependencies, set this variable to
The version of your WordPress stylesheet.
This defaults to false. You may specify the CSS media type here such as “all“, “screen“, “handheld“, “print“, etc.