Buonasera a tutti...

è un po' di tempo che penso di realizzare un blog e oggi ho deciso di farlo utilizzando blogger.com

la particalarità che più mi ha attratto è il fatto di poter modificare la grafica con html e css, gli unici due linguaggi ke conosco piuttosto bene...

ora, dopo aver creato il primo post, decido di modificare appunto la grafica.
vado su personalizza, poi su modello e scelgo modifica HTML... ora mi apper il codice sottoriportato, però io noto ke non è html, ma xml...

allora perchè dice modifica HTML? forse posso modificare l'aspetto grafico solo con i css senza toccare il codice xml? oppure devo studiarmi la guida all'xml?

VI PREGO DI AIUTARMI... Questo è il link

questo il codice in "modifica HTML":

codice:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>

<head>
  <b:include data='blog' name='all-head-content'/>
  <title><data:blog.pageTitle/></title>
  <b:skin><![CDATA[/*
-----------------------------------------------------
Blogger Template Style Sheet
Name:     Scribe
Designer: Todd Dominey
URL:      domineydesign.com / whatdoiknow.org
Date:     27 Feb 2004
Updated by: Blogger Team
------------------------------------------------------ */

/*
   Variable definitions
   ====================
   <Variable name="textColor" description="Text Color" type="color"
             default="#29303b" value="#29303b">
   <Variable name="postTitleColor" description="Post Title Color" type="color"
             default="#1b0431" value="#1b0431">

   <Variable name="linkColor" description="Link Color" type="color"
             default="#473624" value="#473624">
   <Variable name="visitedLinkColor" description="Visited Link Color" type="color"
             default="#956839" value="#956839">
   <Variable name="pageHeaderColor" description="Blog Title Color" type="color"
             default="#612e00" value="#612e00">
   <Variable name="blogDescriptionColor" description="Blog Description Color"
             type="color" default="#29303B" value="#29303B">
   <Variable name="sidebarHeaderColor" description="Sidebar Title Color"
             type="color"
             default="#211104" value="#211104">

   <Variable name="bodyFont" description="Text Font"
             type="font"
             default="normal normal 100% Georgia, Times New Roman,Sans-Serif;" value="normal normal 100% Georgia, Times New Roman,Sans-Serif;">
   <Variable name="headerFont" description="Sidebar Title Font"
             type="font"
             default="normal normal 150% Georgia, Times New Roman,sans-serif" value="normal normal 150% Georgia, Times New Roman,sans-serif">

   <Variable name="pageTitleFont" description="Blog Title Font"
             type="font"
             default="normal normal 225% Georgia, Times New Roman,sans-serif" value="normal normal 225% Georgia, Times New Roman,sans-serif">
   <Variable name="blogDescriptionFont" description="Blog Description Font"
             type="font"
             default="italic normal 100% Georgia, Times New Roman, sans-serif" value="italic normal 100% Georgia, Times New Roman, sans-serif">
*/ 

/* Defaults
----------------------------------------------- */
body {
	margin:0;
	padding:0;
	font-size: small;
        text-align:center;
	color:$textColor;
	line-height:1.3em;
	background:#483521 url("http://www.blogblog.com/scribe/bg.gif") repeat;
}

blockquote {
	font-style:italic;
	padding:0 32px;
	line-height:1.6;
	margin:0 0 .6em 0;
}

p {
  margin:0;
  padding:0;
}

abbr, acronym {
	cursor:help;
	font-style:normal;
}
	
code {
  font-size: 90%;
  white-space:normal;
  color:#666;
}

hr {display:none;}

img {border:0;}

/* Link styles */
a:link {
  color:$linkColor;
  text-decoration:underline;
}
a:visited {
  color: $visitedLinkColor;
  text-decoration:underline;
}
a:hover {
  color: $visitedLinkColor;
  text-decoration:underline;
}
a:active {
  color: $visitedLinkColor;
}


/* Layout
----------------------------------------------- */
#outer-wrapper {
	background-color:#473624;
	border-left:1px solid #332A24;
	border-right:1px solid #332A24;
	width:700px;
	margin:0px auto;
        padding:8px;
	text-align:center;
        font: $bodyFont;
}
#main-top {
	width:700px;
	height:49px;
	background:#FFF3DB url("http://www.blogblog.com/scribe/bg_paper_top.jpg") no-repeat top left;
	margin:0px;
        padding:0px;
	display:block;
}
#main-bot {
	width:700px;
	height:81px;
	background:#FFF3DB url("http://www.blogblog.com/scribe/bg_paper_bot.jpg") no-repeat top left;
	margin:0;
        padding:0;
	display:block;
}
#wrap2 {
	width:700px;
	background:#FFF3DB url("http://www.blogblog.com/scribe/bg_paper_mid.jpg") repeat-y;
	margin: -14px 0px 0px 0px;
	text-align:left;
	display:block;
}

#wrap3 {
	padding:0 50px;
}

.Header {

}

h1 {
  margin:0;
  padding:0 0 6px 0;
  font: $pageTitleFont;
  color: $pageHeaderColor;
}

h1 a:link {
  text-decoration:none;
  color: $pageHeaderColor;
}

h1 a:visited {
  text-decoration:none;
}

h1 a:hover {
  border:0;
  text-decoration:none;
}
.Header .description {
  margin:0;
  padding:0;
  line-height:1.5em;
  color: $blogDescriptionColor;
  font: $blogDescriptionFont;
}

#sidebar-wrapper {
	clear:left;
}

#main {	
	width:430px;
	float:right;
	padding:8px 0;
	margin:0;
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */
}
#sidebar {
	width:150px;
	float:left;
	padding:8px 0;
	margin:0;
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */
}	
#footer {
	clear:both;
	background:url("http://www.blogblog.com/scribe/divider.gif") no-repeat top left;
	padding-top:10px;
	_padding-top:6px; /* IE Windows target */
}
#footer p {
	line-height:1.5em;
	font-size:75%;
}

/* Typography :: Main entry
----------------------------------------------- */
h2.date-header {
	font-weight:normal;
	text-transform:uppercase;
	letter-spacing:.1em;
	font-size:90%;
	margin:0;
	padding:0;
}
.post {
	margin:8px 0 24px 0;
}
.post h3 {
	font-weight:normal;
	font-size:140%;
	color:$postTitleColor;
	margin:0;
	padding:0;
}
.post h3 a { 
  color: $postTitleColor;
 }
.post-body p {
	line-height:1.5em;
	margin:0 0 .6em 0;
	}
.post-footer {
  font-family: Verdana, sans-serif;
  font-size:74%;
  border-top:1px solid #BFB186;
  padding-top:6px;
}

.post-footer a { 
  margin-right: 6px;
 }

.post ul {
	margin:0;
	padding:0;
}
.post li {
	line-height:1.5em;
	list-style:none;
	background:url("http://www.blogblog.com/scribe/list_icon.gif") no-repeat 0px .3em;
	vertical-align:top;
	padding: 0 0 .6em 17px;
	margin:0;
}

.feed-links {
  clear: both;
  line-height: 2.5em;
}

#blog-pager-newer-link {
  float: left;
 }
 
#blog-pager-older-link {
  float: right;
 }
 
#blog-pager {   
  text-align: center; 
 }

/* Typography :: Sidebar
----------------------------------------------- */
.sidebar h2 {
	margin:0;
	padding:0;
	color:$sidebarHeaderColor;
        font: $headerFont;
}
.sidebar h2 img {
	margin-bottom:-4px;
	}

.sidebar .widget { 
	font-size:86%;
	margin:6px 0 12px 0;
	padding:0;
        line-height: 1.4em;
}

.sidebar ul li {
	list-style: none;
	margin:0;
}

.sidebar ul {
  margin-left: 0;
  padding-left: 0;
}

/* Comments
----------------------------------------------- */
#comments {}
#comments h4 {
  font-weight:normal;
  font-size:120%;
  color:#29303B;
  margin:0;
  padding:0;
}
#comments-block {
  line-height:1.5em;
  }
.comment-author {
	background:url("http://www.blogblog.com/scribe/list_icon.gif") no-repeat 2px .35em;
	margin:.5em 0 0;
	padding:0 0 0 20px;
	font-weight:bold;
}
.comment-body {
	margin:0;
	padding:0 0 0 20px;
}
.comment-body p {
	font-size:100%;
	margin:0 0 .2em 0;
}
.comment-footer {
	color:#29303B;
	font-size:74%;
	margin:0 0 10px;
	padding:0 0 .75em 20px;
}
.comment-footer a:link {
	color:#473624;
	text-decoration:underline;
}
.comment-footer a:visited {
	color:#716E6C;
	text-decoration:underline;
}
.comment-footer a:hover {
	color:#956839;
	text-decoration:underline;
}
.comment-footer a:active {
	color:#956839;
	text-decoration:none;
}
.deleted-comment {
  font-style:italic;
  color:gray;
  }

	
/* Profile
----------------------------------------------- */

#main .profile-data { 
  display:inline;
}

.profile-datablock, .profile-textblock {
  margin:0 0 4px 0;
}
.profile-data {
  margin:0;
  padding:0 8px 0 0;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:90%;
  color:#211104;
}
.profile-img { 
  float: left;
  margin: 0 5px 5px 0;
  border:1px solid #A2907D;
  padding:2px;
}

#header .widget, #main .widget {
	margin-bottom:12px;
	padding-bottom:12px;
}

#header { 
  background:url("http://www.blogblog.com/scribe/divider.gif") no-repeat bottom left;
}

/** Page structure tweaks for layout editor wireframe */
body#layout #outer-wrapper { 
 margin-top: 0;
 padding-top: 0;
 }

body#layout #wrap2,
body#layout #wrap3 { 
 margin-top: 0;
 }

body#layout #main-top { 
 display:none;
}
]]></b:skin>
</head>

<body>
  <div id='outer-wrapper'>

<div id='main-top'/> 

<div id='wrap2'><div id='wrap3'>

  <b:section class='header' id='header' maxwidgets='2' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Francesco Orefice Personal Blog (Intestazione)' type='Header'/>
</b:section>
 
  <div id='sidebar-wrapper'>
    <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='BlogArchive1' locked='false' title='Archivio blog' type='BlogArchive'/>
<b:widget id='Profile1' locked='false' title='Chi sono:' type='Profile'/>
</b:section>
  </div>

  <b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Post sul blog' type='Blog'/>
</b:section>

  <div id='footer-wrapper'>
    <b:section class='footer' id='footer'/>
  </div>
 
</div></div>
<div id='main-bot'/> 
</div>
</body>
</html>