Cómo modificar el fondo en la plantilla espacial de Baidu
Le indicamos la forma más sencilla. Primero, elija una plantilla que le guste en general y luego configúrela: Personalizar plantilla: cree una nueva plantilla basada en la plantilla actual. Puede ver una gran cantidad de código y no hacerlo. No te preocupes, siempre y cuando veas una dirección de archivo .jpg o .gif, cópiala y ábrela en otra barra de direcciones para ver la imagen, y luego reemplaza esa dirección con tu dirección de imagen favorita de tamaño similar. No lo hago. No sé sobre ti. ¿Lo entiendes? También hay un nombre de espacio de introducción y un área de introducción debajo de #header - la parte principal - la parte completa del título del encabezado del espacio #header div.lc - la imagen de fondo en la esquina superior izquierda de la página de inicio #header div.rc - el imagen de fondo en la esquina superior derecha de la página de inicio #header div.tit - nombre del espacio, título principal, tamaño y color del nombre #header div.tit a.titlink - enlace del nombre del espacio, sin hacer clic #header div.tit a.titlink: visitado: enlace que se ha visitado #header div.desc ——Introducción del espacio, es decir, subtítulo, posición, tamaño, color, barra de navegación #tabline ——La línea horizontal debajo del menú, es decir, el separador, utilizada para separar desde el nombre del espacio #tab ——El cuerpo principal de la barra del menú de navegación—parte superior de la página" Blog de la página de inicio | Álbum de fotos..." imagen de fondo de la barra #tab a.on, #tab a.on:link, # pestaña a.on:visited - estado seleccionado, es decir, "enlace de la barra de navegación", tamaño, color + fondo #tab span ——El separador "|" entre los elementos de la barra de navegación "Enlaces que han sido visitados #tab2 ——(Básico opciones | Configuración de plantilla | Configuración avanzada | Estadísticas de acceso) Las propiedades del cuerpo del menú de esta línea #tab2 abarcan ——TAB estado seleccionado #tab2 a ——TAB estado no seleccionado #tab2 a :link #tab2 a:visited ——El enlace que tiene sido visitado------------------------------------------ -------------- --------------------------------- Área de contenido.etapa —— Todas las partes del cuerpo de la página (debajo de la barra de navegación ) Otras áreas (es decir, información como el número de visitas) #comm_info Parte principal - "La gente ha visitado este espacio" color y posición en "Otros" #comm_info div.line - "La gente ha visitado este espacio" Configuraciones relacionadas del rosa línea divisoria debajo de "Visita este espacio" #comm_info a——"¿Qué es RSS?" color en "Otros" #comm_info a:hover——efecto de desplazamiento #comm_info.mod——título del área #m_comm_info.modbox— — Otros módulos regionales #pvshow — Número de visitas fuente #m_comm_info div a — Logotipo de Baidu ---------------------------------- -- ------------------------------------------------ Número de página área #página —— Cuerpo principal altura tamaño posición #espacio de página —— Número de página actual (no se puede hacer clic) #página a.pc —— No se ha hecho clic en la página anterior y la página siguiente #página a.pc:visitada —— Ha sido en la que se hizo clic #página a.pi ——Número de página (en la que se puede hacer clic) #página a.pi:visitada ——El enlace que se ha visitado---------------------- ------------------------------------------------- - ------- Configuración de columna espacial.stage{} cuerpo principal
Estilo de columna/*Código ascendente en el lado derecho de la página*/ #layout{margin-top:-25px}/*Sección más a la izquierda*/ #layout td.c1t1,#layout td.c2t1,#layout td.c2t3,# diseño td. c2t2{ancho:0px} #layout td.c2t3{padding-right:10px;padding-left:8px;width:96%!important;width:28%; position:relative;/*código ascendente izquierdo*/ top:- 388px; padding-top:0; background:#FFFFFF; display:block;/*middle column*/border-left:1px solid #DDDDDD} Lo anterior es el patrón de 2 columnas horizontales y 2, 2 columnas horizontales y 3, y así sucesivamente. ¡Deja un mensaje si no lo entiendes! ¡O ajústelo usted mismo! -------------------------------------------------- ------------------------------- Module area.mod - título del módulo, espaciado superior e inferior.modhandle{cursor:move} .modth ——La distancia entre el cuerpo principal de la barra de título del módulo y el texto.modhead ——La posición del área de título del módulo.modopt ——El área de operación del módulo (como escribir un nuevo artículo), spacing.modtit —— —El área de título del módulo (como lista de artículos, archivo personal)) Tamaño y color.modtitlink - Título del módulo link.modact - Enlace de texto de operación, enlace "Modificar perfil", - Configuraciones de tamaño y color relacionadas para "Editar" y otros enlaces en la esquina superior derecha.
.modbox: el color de fondo principal del área de contenido del módulo, etc. a.modact:link: el color del enlace "Modificar información personal" a.modactlink:visited: el enlace visitado.modtl: el fondo de la imagen del borde suburbano en la parte superior izquierda esquina del módulo, La primera columna, columna vacía.modtc: el fondo de la imagen de fondo en el módulo, la segunda y tercera columnas, archivos personales, modificación de información personal.modtr: el fondo de la imagen de fondo en la esquina superior derecha del módulo, la cuarta columna, columna vacía.modbl - —La imagen de fondo en la esquina inferior izquierda del módulo.modbc——La imagen de fondo en el medio y la parte inferior del módulo.modbr——La imagen de fondo en la esquina inferior derecha del módulo------------------ ------------------------------- ------------- ----------- Área del artículo #m_blog div.tit ——Título del artículo #m_blog div.tit a ——Artículo enlace del título, tamaño y color, no hecho clic #m_blog div.tit a:visited —— Tamaño del título del artículo y color de los enlaces visitados #m_blog div.date - fecha de publicación del artículo, tamaño del texto y color #m_blog div.cnt - tamaño del contenido del artículo y color #m_blog div.more - "Leer el texto completo >>" #m_blog div.more a ——El tamaño y color de “Leer el texto completo >>”, en el que no se ha hecho clic #m_blog div.more a: visitado —— El tamaño y color de “Leer el texto completo >>” que se ha visitado #m_blog div.opt — —Área de operación del artículo (como el color y tamaño de "Editar", etc.) #m_blog div. opt a - Tamaño y color del enlace de operación del artículo #m_blog div.opt a:visited - "Editar Eliminar comentario (4) Ver (21)" ha sido enlaces visitados #m_blog div.line - configuraciones relacionadas de la barra separadora #m_blog div. ninguno: no hay información de solicitud de artículo, configuración invisible, no es necesario cambiar----------------------- ---------------------- ---------------------- --------------- Área de perfil #mod_profile.modtit - Título del perfil de la página de inicio #m_pro a - Color de "Ver detalles" en el perfil, sin hacer clic #m_pro a :hover - efecto de desplazamiento #m_pro a:visited - el enlace visitado "Ver detalles" en el perfil #m_pro div.image - el muestra la posición del avatar personal en el perfil, dividida en "centro, izquierda", derecha——centro, izquierda, derecha” #m_pro div.act ——área de operación——la distancia entre la presentación personal y el avatar #m_pro div.user ——el tamaño y color del nombre de usuario personal #m_pro div.desc ——presentación personal Tamaño y color #m_pro div.line - línea divisoria #m_pro td #m_pro .photo - fondo de la foto (no puedes obtener una vista previa de este elemento a continuación) # m_pro .photo td - agregar como amigo y enviar mensaje en el medio "|" #m_pro .photo imagen #m_pro .photo .line - avatar subrayado #m_pro .ref #m_pro .ref .tit - de "nombre de usuario" a "círculo" " #m_pro .ref .cnt #m_pro .basic td - nombre de usuario para ver esto Los usuarios están esperando en Baidu #m_pro .basic .tit #m_pro .basic a:hover - enlace de fecha de la provincia masculina, el enlace sobre el que pasa el mouse tiene no se ha hecho clic en #m_pro.
básico a.nlk:hover - "publicar discurso en la barra" "conocer la respuesta" #m_pro .pline - línea divisoria media #m_pro .pitem - altura de fuente #m_pro .pitem .tit - la escuela a la que asistí, etc. #m_pro .pitem a:hover——el enlace sobre el que pasa el mouse---------------------------------------------- - ----------------------------------------- Área del álbum #m_album div.image —— La posición de visualización de las fotos en el álbum, dividida en "centro, izquierda, derecha——centro, izquierda, derecha" #m_album div.page ——"Página anterior" >> "Página siguiente" #m_album div.page a — —No se ha hecho clic en la "página siguiente" de la "página anterior" #m_album div.page a:visited—— Se ha visitado la "página siguiente" de la "página anterior" enlace #m_album div.image—— Área de vista previa del álbum# m_album a img——Enlace de imagen#m_album a:hover img——Efecto de desplazamiento de imagen#cbut——Botón de operación del álbum#cbut a img{border:0px;filter:alpha(enabled=0)}—— Imagen del botón--- --------------------------------------- ----- --------------------- Área de enlaces amigables #m_links div.item - subelemento - fuente en enlaces amigables Tamaño del color #m_links div. item a - Nombre (enlace) - El tamaño y color de la fuente en el enlace amigable, en el que no se ha hecho clic #m_links div.item a:visited - El tamaño y el color de la fuente en el enlace amigable, en el que se ha hecho clic #m_links div.line - línea divisoria------------------------------------------ ---- ------------------------------------- Módulo personalizado 1-4 #m_mylink1-4 div.item ——El contenido de "Descripción" #m_mylink1-4 div.item a——Nombre del enlace del título #m_mylink1-4 div.item a:visited——Nombre del enlace del título El enlace que se ha visitado #m_mylink1-4 div .line—— Línea divisoria-------------------------------------------- ---- -------------------------------- Área de clasificación de artículos #m_artclg div.item ——Subitem——Cada uno elemento en la clasificación del artículo El número de temas y el tamaño y color de los corchetes detrás de la categoría #m_artclg div.item a - Nombre de la categoría (enlace) - El tamaño y color de cada categoría en la categoría del artículo, en la que no se hace clic #m_artclg div. elemento a:visitado - Cada categoría en la categoría del artículo Categoría ha sido visitada enlace #m_artclg div.line - línea divisoria - configuración relacionada del separador entre cada categoría en la categoría del artículo ------------- ------ -------------------------------------------- ------ ----------- Área de comentarios más recientes #m_comment div.item ——Elemento secundario ——El tamaño y color del nombre de usuario en el último comentario, sin hacer clic en #m_comment div. elemento a ——El nombre de usuario en el color del tamaño del último comentario, sin hacer clic en #m_comment div
.item a:visited: el tamaño y el color del nombre de usuario en el último comentario en el que se hizo clic #m_comment div.item a.cnt: el tamaño y el color del texto del comentario en el último comentario en el que no se hizo clic # m_comment div.item a.cnt: visitado ——El tamaño y color del texto del comentario en el último comentario El enlace visitado #m_comment div.item a.cnt:hover ——El enlace donde está el texto del comentario en el último comentario. desplazado por el mouse #m_comment div.line ——El último comentario Configuraciones relacionadas para dividir líneas entre comentarios----------------------------. -------------------- ------------------------------ ------------ Lista de álbumes #m_albumlist - álbum de primer nivel Fondo de área #m_albumlist div.none - no hay información de solicitud de foto #m_albumlist a img - imagen de portada de álbum pequeño #m_albumlist a:hover img - pasar el mouse efecto #m_albumlist div.line - línea divisoria #m_albumlist div.tit - — Título del álbum #m_albumlist div.tit a #m_albumlist div.tit a:hover — Efecto de desplazamiento #m_albumlist span.count — Número de fotos #m_albumlist a.act — Enlaces del área de acción, como editar, eliminar #m_albumlist a. act:hover - efecto de desplazamiento del mouse #m_albumlist div.note - el área de imagen de la segunda capa del álbum #m_albumlist div.desc - introducción del álbum #m_albumlist span.size - tamaño de la foto #m_albumlist #page - número de página actual #m_albumlist #page a - otros números de página #m_albumlist #page a:hover - efecto de desplazamiento del mouse #imagee a img - área de imagen de tercera capa #m_albumlist div.phimg a img - imagen #m_albumlist div.phimg a:hover img ——Estilo de desplazamiento del botón de imagen #m_albumlist div.phinfo——Información de la imagen #m_albumlist div.phpage——Área del botón de acción #m_albumlist div.phpage a img——Botón de acción #m_albumlist div.phpage a: hover img——Estilo de desplazamiento del botón de acción------------------------------------------ ------ ---------------------------------- Lista de amigos #m_friend div.filter #m_friend div .catalog #m_friend a img ——Avatar de amigo #m_friend a:hover img——Efecto de desplazamiento #m_friend div.user #m_friend div.user a ——Nombre del amigo (enlace), sin hacer clic #m_friend div.user a:hover— —Efecto de desplazamiento #m_friend div.user a img——Imagen del botón de acción #m_friend div.user a:hover img——Imagen del botón de acción #m_friend div.user a:visited——Un enlace visitado #m_friend div.line——Puntos Límite----------------------
-------------------------------------------------- ------- Establecer estadísticas de acceso y configuración de plantilla #m_setting a ——Enlace {color:#3399CC} #m_setting a:hover ——Efecto de desplazamiento #m_setting a:visited ——Configuración de color, se ha visitado El enlace # m_setting - se ha hecho clic en la configuración del color del cuerpo #m_setting img.sel - vista previa de la plantilla (estado seleccionado) {border:4px solid #FFDB7B} #m_setting img.unsel - vista previa de la plantilla (estado no seleccionado) #m_setting span.tit - Nombre del título de la plantilla #m_setting span.usr - Nombre del autor #m_setting div.sel - Texto de la "plantilla actual" #m_setting div.line - Línea divisoria --------- ---------- ---------------------------------------- ---------- ----------- Anuncio del sistema #m_sysinfo a - No se ha hecho clic en la configuración del color del enlace #m_sysinfo a:visited - Se ha visitado la configuración del color Enlaces anteriores #m_sysinfo ——Tamaño del color principal #m_sysinfo span.new ——Tamaño de color más reciente #m_sysinfo span.date ——Tamaño de color de hora de publicación ------------- ---------- ---------------------------------------- ---------- - Opciones básicas #m_setbase ——Tamaño del color del cuerpo #m_setbase td ——Tamaño del color #m_setbase div.line —— Línea límite #spSpaceName ——Nombre del espacio #spSpaceDescri ——Introducción al espacio #spConfigDispNum ——Mostrar artículos por página #spConfigDispMod —— Visualización del artículo #spDateMod ——Formato de hora #btn_submit ——Botón de opción Guardar------------------------- ---------- ---------------------------------------- ----- Comentarios de usuario #in_comment — —Ancho del cuerpo #in_comment div.tit —— Configuración de tamaño y color del título #in_comment div.user —— Nombre del póster, número de serie, tamaño de color de línea y otras configuraciones #in_comment div.user a — —Tamaño del color del nombre del póster (enlace) que no se ha hecho clic #in_comment div.user a:visited —Enlace visitado #in_comment div.user span.date — Tamaño del color de la hora de publicación #in_comment div.desc —Tamaño del color del contenido del comentario #in_comment div.line - Configuración del separador #in_send div. tit - Configuración de comentario (título) ---------------------- --------------------- ----------------------- -------- Archivo de artículos #m_filed div.item ——Configuración del tamaño del color del tema #m_filed div.item a ——La configuración de tamaño de color en la que no se ha hecho clic #m_filed div.item a:visited ——Se ha visitado Enlaces anteriores #
m_filed div.line - línea divisoria------------------------------------------- -- ----------------------------------------------- Reciente Visitante #m_track a ——Color y tamaño de fuente del ID del visitante #m_track a:hover—— El enlace donde el mouse se desplaza sobre el ID #m_track a img——El efecto de filtro del avatar del visitante, otros efectos de filtro {filter:invert }, {filter:xray} #m_track a:hover img—— Efecto de desplazamiento del mouse en el avatar del visitante----------------------- ------------ -------------------------------------- - Búsqueda de Baidu #m_search - Área de búsqueda de Baidu #m_search input.text - Configuración de fuentes como "Internet" #m_search input.radio - Configuración de fondo como "Internet" #m_search input.submit - Configuración de "Búsqueda de Baidu" #mod_search.mod {antecedentes:url() sin repetición 0% 0%} ——Título de búsqueda de Baidu #m_search input.text ——Cuadro de entrada #m_search label ——Área del cuadro #m_search input.radio ——El círculo delante del cuadro # m_search input.submit ——Botón Enviar ------------------------------------------ ---------- ---------------------------- Tablero de mensajes #mod_board.mod - Módulo de tablero de mensajes #mod_board table.modth: los siguientes 6 elementos son los siguientes: si no se configuran, se heredará el estilo del módulo general #mod_board td.modtl #mod_board div.modhead #mod_board span.modtit #mod_board td.modtc #mod_board td.modtr input .#spBCmtAuthor——Entrada del cuadro de entrada del nombre del mensaje.#spBCmtURL—— Cuadro de entrada de la URL del mensaje #spBCmtText - Cuadro de entrada del mensaje #vercode entrada - Cuadro de entrada del código de verificación #in_send td.f14 entrada - Botón de mensaje #in_msg div - Área de mensaje #in_msg a - Enlace del área de mensajes #in_msg a:hover ——Efecto de desplazamiento#in_msg div.tit——Título del mensaje del internauta#in_msg table.item——Título del mensaje del internauta#in_msg td.index——Número de serie del mensaje#in_msg div.user— —Usuario del mensaje#in_msg div.user a img ——Avatar del usuario#in_msg div.user a:hover img——efecto de desplazamiento#in_msg td.cnt——tiempo del mensaje#in_msg div.desc——contenido del mensaje#in_msg div.line ——línea de demarcación----- ----------------------------------------- --------- ----------------------- Mi colección #m_cang div.item - Configuración del tamaño del color de el cuerpo principal #m_cang div.item a - Aún no se ha hecho clic en la configuración de tamaño de color#m_cang div.item a:hover——efecto de desplazamiento#m_cang div.item a
:visited——El enlace visitado#m_cang div.line——La línea divisoria--------------------------------- -------------------------------------------------- Columna Figure.stat td{line-height:22px;color:#333333;font-size:14px}/*Fuentes como visitas acumulativas*/ .chart{position:relative;margin:10px 0 30px 31px;border:1px solid # B3B3DC}/*La línea izquierda en el gráfico de barras*/ .chart div.bar,.chart div.barhl{position:absolute;background:#DCDCF4;border:1px solid #B3B3DC;line-height:0}/* Color de la columna de línea\color inferior*/ .chart div.barhl{fondo:#C2C2F4}/*Efecto de desplazamiento de la columna de línea*/ .chart div.liney{position:absolute;border-top:1px dotted #B9B9B9;line-height: 0}/*Línea separadora*/ .chart div.titx,.chart div.titxhl,.chart div.tity{position:absolute;color:#666;font- size:9px;font-family:Arial;text-align :center;white-space:nowrap}/*Números de coordenadas*/ .chart div.titxhl{color:#FF0000}/*Color de fuente del mes inicial*/ .chart div.hit{position:absolute;z-index:1000 ; width:100px;color:#666;font-size:12px;font- family:Arial}/*Efecto de estadísticas de acceso al desplazamiento de la columna de línea*/ .chart div.tity{text-align:right} .stattop{float :left; margin-top:20px;margin-right:14px;padding:10px;width:199px! important;width:220px;border:1px solid #CDCDCD}/*Las siguientes son las configuraciones de análisis*/ .stattop{float:left ; margin-top:20px;margin-right:14px;padding:10px;width:199px! importante;width:220px;border:1px sólido #CDCDCD} .stattop .list{margin-top:6px} .stattop .list td { altura: 20px}---------------------------------------------- -- ---------------------------------- Calendario #mod_cals .modbox - módulo de calendario #cals - cuerpo del calendario Fondo , borde #mod_cals .modbox td - configuración de color de fuente #m_cals - establece el color de fondo del módulo #m_cals div - configuración de fondo #cals .cal_body, #cals .cal_mth - parte de fecha excepto el controlador de año y mes, incluidas fechas semanales y generales#cals. tabla cal_yr——Tabla de año y mes#cal
s .cal_yr td——*año, mes celda #cals .cal_yr .cal_pre——Flecha del mes anterior (normal) #cals .cal_yr .cal_nxt——Flecha del mes siguiente (normal) #cals .cal_yr .cal_pre_ovr—— Flecha del mes anterior (mouseover) #cals .cal_yr .cal_nxt_ovr - Flecha del próximo mes (mouseover) -------------------------- -------- ------------------------------------------ ------ Lo último de un amigo artículo #mod_friblog .modbox - Módulo del último artículo de un amigo #m_friblog div.item - Configuración del tamaño de color del cuerpo del nombre del amigo #m_friblog div.item a - Configuración de tamaño de color del nombre del amigo en el que no se ha hecho clic #m_friblog div.item a: visitado——El nombre del amigo ha sido visitado enlace #m_friblog div.item a.cnt——Contenido del artículo color tamaño #m_friblog div.item a.cnt:visited——El contenido del artículo ha sido visitado El enlace #m_friblog div.item a.cnt :hover - efecto de desplazamiento del contenido del artículo #m_friblog div.line - línea divisoria #m_friblog a img - efecto de filtro del avatar de un amigo, otros efectos de filtro #m_friblog a:hover img——Efecto de desplazamiento del mouse sobre el avatar de un amigo---- ----------------------------------------- --------- ------------------------------------ Edición RSS#m_rss div.item { color:#669900; -size:12px; } /* El tamaño y color de la fuente en el módulo RSS*/ #m_rss div.item table { color:#669900; } #m_rss div.item a { color:#000000; 12px; text-decoration:none; } /* Color de fuente, tamaño de fuente y estilo del enlace en el módulo RSS*/ #m_rss div.item a:visited { color:#3399CC } /* Visitado en el módulo RSS color de fuente del enlace después de */ #m_rss div.item div.dt { margin-bottom:5px; margin-top:5px; font-weight:bold } /* El estilo del título del módulo RSS*/ #m_rss div; . line { border-top:1px solid #D2E9F4; line-height:1px; height:1px; margin-top:5px } /* Estilo de línea divisoria en el módulo RSS*/ ---------- ------------------------------------------------- - ------------------- Adición adicional: div#cals .cal_yr .cal_pre{font-size:8px;background:url(/main/Article/UploadFiles/200606/ 20060619153249362 .gif) centro sin repetición centro;padding-left:10px}/*Flecha del mes anterior (normal)*/ div#cals .cal_yr .cal_nxt{font-
tamaño: 8px; {font-size:8px;background:url(
" target="_blank"
) centro sin repetición;padding-left:10px;cursor:pointer} / *Flecha del mes anterior (mouseover)*/ div#cals .cal_yr .cal_nxt_ovr{font-size:8px;background:url(
" target="_blank"
) no -repeat center center;padding-left:10px;cursor:pointer}/*Flecha del próximo mes (mouse over)*/ div#cals *.cal_active{color:#ffbbbb;text-decoration:none; font-weight:bold;BACKGROUND :url(/main/Article/UploadFiles/200606/20060619153248818.gif) center no-repeat;linehight:15px;}/*Con efecto de fecha actualizada*/ div#cals *.cal_select{padding :2px;border:1px solid # 5491C6;background-color:#00000cc;color:#ffbbbb;text-decoration:underline} /*Efecto de mouse arriba con fecha de actualización*/ div#cals .today{color:#ffbbbb ;padding:2px;border:1px dashed # 89B1ED;FONDO:url(
) centro sin repetición;alto de línea:27px;font-weight:bold;}/*Hoy*/ div#cals td{color:#ffbbbb;text-align :center;font-family:Arial;font-size:12px;font-weight:bold;padding:3px;line-height:14px;white-space:nowrap}/*Fecha */ div#cals .cal_date{color: #ffbbbb}/ ------------------------------------ ---------- ------------------------------- /*Ocultar código de reproductor */ #phx{FILTRO:Alpha (Opacidad=0)} #phx{FILTRO: Alfa(Opacidad=100, FinishOpacity=10, Estilo=2, StartX=20, StartY=40, FinishX=0, FinishY=0 ANCHO: 650px; Modifique los valores correspondientes para cambiar el efecto del reproductor. El código del reproductor no es muy fácil de depurar.