• csdn blog css自定义设置介绍


    可以在博客的配置页面的自定义css栏中填入css样式代码来自定也blog的风格

    csdn blog的页面架构基本是由div实现的,整个页面主要由三个div组成,它们的id分别是:
    csdnblog_header, csdnblog_sidebar, csdnblog_content。
    所以,定义它们的主体样式可以这样:

    #csdnblog_header
    {
    //头部的风格
    }
    #csdnblog_sidebar
    {
    //侧边栏的风格
    }
    #csdnblog_content
    {
    //主体内容的风格
    }

    这三个div又被两个div包裹起来了,它们的id分别是csdnblog_allwrap, csdnblog_midwrap
    这两个还可以定义整个页面的整体样式

    #csdnblog_allwrap
    {
    //你想要的风格
    }
    #csdnblog_midwrap
    {
    //你想要的风格
    }

    页面的头部由以下几部分组成
    1、h1,显示blog的用户自定义标题

    #csdnblog_header h1
    {
    //标题风格设置
    }

    2、h2,显示用户自定义的blog描述

    #csdnblog_header h2
    {
    //blog描述风格设置
    }

    3、ul, id为personalnav, 个人导航列表

    #csdnblog_header ul#personalnav
    {
    //blog个人导航栏风格设置
    }

    4、ul,id为blogsearchsty,搜索栏

    #csdnblog_header ul#blogsearchsty
    {
    //blog搜索框风格设置
    //如果不想显示,可以使用:
    //display:none
    }

    5、ul,id为menu,菜单栏

    #csdnblog_header ul#menu
    {
    //blog菜单风格设置
    //如果不想显示,可以使用:
    //display:none
    }

    自定义侧边栏的CSS
    侧边栏主div的id为csdnblog_sidebar,中间被一层class为gutter的div包裹,最里面一层div的的class为aboutauthor。里面剩下的就是一个个的dl了
    修改起风格可以这样:

    #csdnblog_sidebar div.gutter div.aboutauthor
    {
    }

    更进一步的话,可以:

    #csdnblog_sidebar div.gutter div.aboutauthor dl
    {
    }
    #csdnblog_sidebar div.gutter div.aboutauthor dl dt
    {
    }
    #csdnblog_sidebar div.gutter div.aboutauthor dl dd
    {
    }

    自定义文章的CSS
    每一篇文章都是一个div,其class为default_contents, 这个div包含两个子元素
    1、h6, class为pubtime, 用来显示文章发表的时间。
    修改其css的方法为

    .default_contents h6.pubtime
    {
    //你想要的样式
    }

    2、div,class为user_article,显示文章内容,又包括三部分
    2.1、 h1,class为title_txt,显示文章标题
    2.2、p, 显示文章内容
    2.3、p, class为articalinfo,显示文章信息
    想修改整篇文章区域的总体样式可以这样:

    .default_contents div.user_article
    {
    //你想要的样式
    }

    修改文章标题css样式的方法为

    .default_contents div.user_article h1.title_txt
    {
    //你想要的样式
    }

    其实,直接

    .title_txt
    {
    //你想要的样式
    }

    也可以修改

    修改文章信息的方法为

    .default_contents div.user_article p.articalinfo
    {
    //你想要的样式
    }

    其实,直接

    .articalinfo
    {
    //你想要的样式
    }

    转自 :http://www.ej38.com/showinfo/css-162013.html

  • 相关阅读:
    Android 3.0 r1 API中文文档(108) —— ExpandableListAdapter
    Android 3.0 r1 API中文文档(113) ——SlidingDrawer
    Android 3.0 r1 API中文文档(105) —— ViewParent
    Android 中文 API (102)—— CursorAdapter
    Android开发者指南(4) —— Application Fundamentals
    Android开发者指南(1) —— Android Debug Bridge(adb)
    Android中文API(115)——AudioFormat
    Android中文API(116)——TableLayout
    Android开发者指南(3) —— Other Tools
    Android中文API (110) —— CursorTreeAdapter
  • 原文地址:https://www.cnblogs.com/navigator/p/2917700.html
Copyright © 2020-2023  润新知