黑色个性的设计博客模板_黑色web20博客个人花纹背景设计.rar资源-CSDN文库

共16个文件

jpg：14个

html：1个

css：1个

版权申诉

99 浏览量 2023-04-27 06:54:24 上传评论收藏 98KB RAR 举报

这篇博客模板设计主要聚焦在黑色调的个性化风格，结合了Web 2.0的设计理念，为博主们提供了独特的展示平台。黑色背景往往给人一种高贵、神秘和专业的印象，它能够有效地突出内容，使得文字、图片和其他元素更加醒目。Web 2.0则代表了一种更加互动、动态和用户友好的网络设计趋势，它强调用户体验和视觉吸引力。我们要理解“黑色个性设计”的概念。在网页设计中，黑色通常被用来传达高端、时尚和专业的感觉。这样的设计风格适合那些希望展现独特个性和艺术气息的博客，尤其是对于设计、摄影或时尚相关的博主来说，黑色背景可以为他们的作品提供一个极佳的展示舞台，同时也能吸引对这种风格感兴趣的访客。 Web 2.0的设计原则包括使用鲜艳的颜色、简洁的布局、动态的图形和交互性元素。在这个博客模板中，可能会看到一些明亮的高光色彩来打破黑色的沉闷，以增加视觉冲击力。同时，可能还会包含一些动态效果，如滑动图像、滚动条或悬浮按钮，这些都能提升用户的交互体验。花纹背景是设计中的另一个亮点。在黑色背景下，精细的花纹可以增添优雅和复杂感，同时也可以作为视觉分隔，帮助组织内容区域。花纹设计可以是几何形状、抽象图案或是自然元素的抽象化，它们既装饰了页面，又不会过分分散用户的注意力。博客模板的结构通常包括头部（logo和导航菜单）、主体部分（文章列表或网格布局）、侧边栏（小工具、广告、最新文章等）和页脚（版权信息、社交媒体链接等）。这个模板可能会对这些常规部分进行创新设计，比如使用透明或半透明元素、非传统的排版方式，以及动态的加载效果，来体现Web 2.0的特色。文件名中的“个人”表明此模板可能特别注重博主的自我表达。这意味着设计师可能会提供自定义头像、签名、个人简介等个性化设置，让博主能将自己的个性和故事融入到博客中。这款“黑色个性的设计博客模板_黑色 web20 博客个人花纹背景设计”是一个结合了现代设计趋势和个性化元素的网页设计作品，旨在为用户提供一个既能展示自我风格，又能吸引并留住访客的博客环境。通过合理运用黑色、Web 2.0元素和花纹背景，设计师创造出一个既专业又富有创意的在线空间。

展开

资源推荐

资源详情

资源评论

收起资源包目录

黑色个性的设计博客模板_黑色 web20 博客个人花纹背景设计.rar （16个子文件）

黑色个性的设计博客模板_黑色 web20 博客个人花纹背景设计

template_242_design_blog

css

templatemo_style.css 8KB

index.html 11KB

images

templatemo_body_top.jpg 345B

templatemo_image_02.jpg 23KB

templatemo_menu_right.jpg 858B

templatemo_about.jpg 880B

templatemo_twitter.jpg 2KB

templatemo_image_03.jpg 24KB

ads_125.jpg 4KB

templatemo_list.jpg 488B

templatemo_rss.jpg 2KB

templatemo_body.jpg 2KB

templatemo_sidebar_title.jpg 2KB

templatemo_subscribe.jpg 689B

templatemo_menu_left.jpg 589B

templatemo_image_01.jpg 27KB

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>design blog - free css template</title>
<meta name="keywords" content="free css templates, blog design, 2-column, web design, CSS, HTML" />
<meta name="description" content="Design Blog - free css template, 2-column blog layout" />
<link href="css/templatemo_style.css" rel="stylesheet" type="text/css" />
<script language="javascript" type="text/javascript">
function clearText(field)
{
    if (field.defaultValue == field.value) field.value = '';
    else if (field.value == '') field.value = field.defaultValue;
}
</script>
</head>
<body>

<div id="templatemo_body_wrapper">
<div id="templatemo_wrapper">
    
    <div id="templatemo_header">
            
        <div id="site_title">
            <a href="http://www.moobnn.com/" target="_parent">Design 
            	<span>Blog</span>
                <span class="tagline">Designed by Free CSS Templates</span>
            </a>
        </div> <!-- end of site_title -->
        
        <div id="search_box">
            <form action="#" method="get">
                <input type="text" value="Enter keyword here..." name="q" size="10" id="searchfield" title="searchfield" onfocus="clearText(this)" onblur="clearText(this)" />
              <input type="submit" name="Search" value="Search" id="searchbutton" title="Search" />
            </form>
        </div>
    
   
        <div class="cleaner"></div>
        
    </div> <!-- end of header -->
    
    <div id="templatemo_menu">
        <ul>
            <li><a href="#" class="current"><span></span>Home</a></li>
            <li><a href="#"><span></span>Web 2.0</a></li>
            <li><a href="#"><span></span>Wordpress</a></li>
            <li><a href="#"><span></span>Graphics</a></li>
            <li><a href="#"><span></span>Inspirations</a></li>
            <li><a href="#"><span></span>Freebies</a></li>
        </ul>    	
        
        <div id="register_box">
        	Already Registered? Click <a href="#" class="signup">Here</a> | <a href="#" class="new_reg">Register</a>
        </div>
    </div> <!-- end of templatemo_menu -->
    
    <div id="templatemo_main">
    	
        <div id="templatemo_content">
        
        	<div class="post_box">
            
                <h2><a href="#">Free Blog Design Templates</a></h2>		
                <div class="news_meta">Posted on <a href="#">Web Templates</a>, 14th January 2048 | Tags: <a href="#">Blog</a>, <a href="#">Templates</a>, <a href="#">Design</a>, <a href="#">Free</a></div>
                <div class="image_wrapper"><a href="http://www.moobnn.com/" target="_parent"><img src="images/templatemo_image_01.jpg" alt="image 1" /></a></div>
              <p align="justify">Design Blog is a free CSS layout by <a href="http://www.moobnn.com" target="_parent" title="模板在线">模板在线</a> <a href="http://guantaow.taobao.com" target="_blank">厚朴网络 淘宝店</a> website. Feel free to adapt or edit or cutomize this template for any kind of content management system. Praesent at libero diam. Vivamus venenatis eros lorem, in euismod tortor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Curabitur dictum risus ac eros lacinia sit amet egestas turpis luctus.  <a href="#" class="continue">Continue ...</a></p>
              <div class="cleaner"></div>
            </div>
            
            <div class="post_box">
            
                <h2><a href="#">Web Design Trends</a></h2>		
                <div class="news_meta">Posted on <a href="#">Web Design</a>, 28th July 2048 | Tags: <a href="#">CSS</a>, <a href="#">XHTML</a>, <a href="#">Standards</a></div>
                <div class="image_wrapper"><a href="#" target="_parent"><img src="images/templatemo_image_02.jpg" alt="image 2" /></a></div>
              <p align="justify">Donec magna risus, mollis eget ullamcorper a, fringilla ut ligula. Fusce eu lectus non tortor dictum semper et eget eros. Integer enim eros, bibendum sed rhoncus et, congue vel odio. Sed quis augue turpis, quis vehicula nibh. Quisque hendrerit accumsan tellus, non lobortis lacus tincidunt vel. Pellentesque odio urna, convallis non ultrices quis, cursus id lectus. <a href="#" class="continue">Continue ...</a></p>
        <div class="cleaner"></div>
            </div>
            
           <div class="post_box pb_last">
            
                <h2><a href="#">Best Collection of Freebies</a></h2>		
                <div class="news_meta">Posted on <a href="#">Collection</a>, 26th June 2048 | Tags: <a href="#">Photos</a>, <a href="#">Photography</a>, <a href="#">Free Stuff</a></div>
             <div class="image_wrapper"><a href="#" target="_parent"><img src="images/templatemo_image_03.jpg" alt="image 3" /></a></div>
             <p align="justify">Quisque in diam a justo condimentum molestie. Vivamus a velit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Curabitur quis velit quis tortor tincidunt aliquet. Vivamus leo velit, convallis id, ultrices sit amet, tempor a, libero. Donec diam metus, semper eu elementum at, volutpat vel risus. Curabitur condimentum porttitor libero nec hendrerit. Nullam venenatis laoreet nibh eget iaculis. Ut vel nulla vitae magna aliquam luctus. <a href="#" class="continue">Continue ...</a></p>
             <div class="cleaner"></div>
          </div>
        
        </div>
        
        <div id="templatemo_sidebar">
        
        	<div id="aboutus">
            	<h3>About Design Blog</h3>
                <div class="image_fl"><img src="images/templatemo_about.jpg" alt="about this blog" /></div>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras volutpat aliquet risus, a ornare orci scelerisque et. <a href="#" class="continue">more...</a></p>
          </div>
            
            <div class="cleaner_h20"></div>
            
            <div class="sidebar_box">
            
            	<h3>Our Sponsors</h3>
                
                <div class="ads_125"><a href="http://www.moobnn.com/" target="_parent"><img src="images/ads_125.jpg" alt="ad 1" /></a></div>
                <div class="ads_125 odd"><a href="#" target="_parent"><img src="images/ads_125.jpg" alt="ad 2" /></a></div>
                
                <div class="ads_125"><a href="#" target="_parent"><img src="images/ads_125.jpg" alt="ad 3" /></a></div>
                <div class="ads_125 odd"><a href="#" target="_parent"><img src="images/ads_125.jpg" alt="ad 4" /></a></div>
                
              	<div class="cleaner"></div>
                
            </div>
            
            <div class="sidebar_box">
            	<h3>Categories</h3>
                
                <ul class="sidebar_menu">
                    <li><a href="#">&raquo; Web Design Tips <span>(260)</span></a></li>
                    <li><a href="#">&raquo; Beautiful Wallpapers <span>(380)</span></a></li>
                    <li><a href="#">&raquo; Free Fonts <span>(125)</span></a></li>
                  	<li><a href="#">&raquo; Digital Illustrations <span>(215)</span></a></li>
       		  </ul>
                
          </div>
            
            
            <div class="sidebar_box">
            	<h3>Archives</h3>
                <ul class="sm_two_col">
                    <li><a href="#">&raquo; February 2048</a></li>
                    <li><a href="#">&raquo; January 2048</a></li>
                    <li class="cleaner"><a href="#">&raquo; December 2047</a></li>
                    <li><a href="#">&raquo; Novermber 2047</a></li>
                    <li><a href="#">&raquo; October 2047</a></li>
                    <li><a href="#">&ra