校内网css代码详细教程
CSS代码 到目前为止,你的涂鸦板应该有以下代码
- /*整体页面设置*/
- body {
- color:#9E988C;
- padding:0;
- margin:0;
- background:url(upload/2007_12/071228043573731.gif) repeat;}
- /*隐藏版块*/
- #logo, #tagline, #copyrightlink, .announcement, #userBlog .more, #utility, #permalink, #sidebar, #reportlink{
- display:none}
- /*头部图片设置*/
- #container{
- margin:0 auto;
- width:880px;
- background:url(http://fm231.img.xiaonei.com/blog/20071026/12/20/A240169491211OXC.jpg) no-repeat;}
- /*头部设置*/
- #header {
- height:400px;
- background:none;}
- /*内容部分*/
- #content {
- border:0;
- width:860px;
- padding:20px 20px;
- background:#fff;}
- #widebar {
- width:880px;
- padding:0;
- border:0;
- background:none;}
- /*我的状态样式*/
- #userStatus {
- margin:0;
- padding:10px 0px 10px 10px;}
- /*账号信息列设置*/
- #userUpdates{
- width:640px;}
- /*底部设置*/
- #footer {
- width:880px;
- background:#9E9986;}
- /*底部文字样式*/
- #footer p{
- padding:0 10px;
- color:#686357;}
- /*底部链接样式*/
- #footer a:link,#footer a:visited,#footer a:hover{
- color:#686357;}
- /*整体链接样式*/
- /*未访问的链接和已访问的链接*/
- a:link,a:visited{
- color:#9E988C;}
- /*鼠标在链接时的样式*/
- a:hover{
- color:#686357;}
- /*导航条样式*/
- #navigation {
- border-left:0;
- background: #9E988C;}
- #navigation ul li{
- background-image:none !important;}
- #navigation a:link,#navigation a:visited {
- color:#fff;
- background:#9E988C;}
- #navigation a:hover {
- background:#686357;}
- /*导航子列表样式*/
- #navigation ul ul{
- background:#9E988C;
- border: 1px solid #686357;}
- #navigation ul ul a {
- color:#fff;
- border-bottom: 1px solid #686357;
- background:#9E988C;}
- #navigation ul ul a:hover {
- color:#fff;
- background: #686357;}
小节回顾:看到这里你应该要学会这些
- 知道可以使用margin-left,margin-right调整位置
- 知道文字美化是分有链接和无链接的
- 链接有四种状态,而我们常用前三个,第一个和第二个的设置一般是一样的.