Fork Me On Github
zodream 其他技术 2020-03-11

wordpress 学习(二)添加css

wq_enqueue_style($handle,$src,$deps,$ver,$media);

$handle (必需)给样式命名

$src 路径 get_stylesheet_uri() 默认会加载 style.css

$deps 依赖关系,默认false 不存在依赖, array();接受依赖样式名

$ver 版本号 避免用户端的缓存而使样式不刷新 例如:zx.css?ver=3.2

$media 为指定媒体制定的样式 all
braille embossed handheld print projection screen speech tty tv 例如

@media screen and min width 400{
    .hh{
        color:#fff;
    }
}

wp_register_style( $handle, $src, $deps, $ver, $media ); 注册样式 再使用wp_enqueue_style($handle); 排队加载

也可以使用 function add_stylesheet_to_head() { echo "<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>"; }

add_action( 'wp_head', 'add_stylesheet_to_head' ); 但无法检查CSS文件是否已经被包含在页面中

wp_enqueue_scripts 用来在网站前台加载脚本和CSS admin_enqueue_scripts 用来在后台加载脚本和CSS login_enqueue_scripts 用来在WP登录页面加载脚本和CSS

例如:function nways(){ wp_enqueue_style(); }

add_action("wp_enqueue_scripts","nways");

添加动态内联样式:wp_add_inline_style()

如果你的主题有选项可自定义主题的样式,你可以使用 wp_add_inline_style() 函数来打印内置的样式:

<?php

function mytheme_custom_styles() { wp_enqueue_style( 'custom-style', get_template_directory_uri() . '/css/custom-style.css' ); $bold_headlines = get_theme_mod( 'headline-font-weight' ); // 比方说,它的值是粗体“bold” $custom_inline_style = '.headline { font-weight: ' . $bold_headlines . '; }'; wp_add_inline_style( 'custom-style', $custom_inline_style ); } add_action( 'wp_enqueue_scripts', 'mytheme_custom_styles' );

?>

wp_style_is( $handle, $state ); 检查样式的排队状况

wp_style_add_data($handle,$key,$value) 添加元数据到你的样式中,包括条件注释、RTL的支持和更多!

  • 'conditional' string Comments for IE 6, lte IE 7 etc.
  • 'rtl' bool|string To declare an RTL stylesheet.
  • 'suffix' string Optional suffix, used in combination with RTL.
  • 'alt' bool For rel="alternate stylesheet".
  • 'title' string For preferred/alternate stylesheets.

注销样式文件:wp_deregister_style() 例如 if(wp_style_is("boostop.min","regitered")) { wp_deregister_style('boostop.min'); }

wp_dequeue_style() 取消已经排列的样式表

点击查看全文
标签: wordpress
0 34 0