首页 / HTML / 空间页面CSS说明_CSS/HTML

空间页面CSS说明_CSS/HTML

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了空间页面CSS说明_CSS/HTML，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含10393字，纯文字阅读大概需要15分钟。

内容图文

什么是CSS？

CSS就是一种叫做样式表（stylesheet）的技术。也有的人称之为层叠样式表（Cascading Stylesheet）。在主页制作时采用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。只要对相应的代码做一些简单的修改，就可以改变同一页面的不同部分，或者页数不同的网页的外观和格式。

空间页面CSS说明

body 整个空间页面{background-color:#FFFFFF}

--------------------------------------------------------------------------------

空间名称和简介区域
#header 主体部分{height:89px;background:#3399CC}
#header div.lc 左背景图{background:url(temp1/hdl.jpg) no-repeat}
#header div.rc 右背景图{background:url(temp1/hdr.jpg) no-repeat top right}
#header div.tit 空间名称{top:8px;left:20px;line-height:22px;font-size:20px;font-family:黑体}
#header div.tit a.titlink 空间名称链接{color:#FFFFFF;text-decoration:none}
#header div.tit a.titlink:visited{color:#FFFFFF;text-decoration:none}
#header div.desc 空间简介{top:33px;left:20px;color:#FFFFFF;font-size:13px}
#tabline TAB菜单下方的横线{top:89px;background-color:#FFFFFF}
#tab TAB菜单主体{top:67px;background:url(temp1/tabbg.gif) repeat-x}
#tab a.on,#tab a.on:link,#tab a.on:visited TAB选中状态{margin-top:3px;border-left:1px solid #FFFFFF;border-right:1px solid #FFFFFF;border-top:1px solid #FFFFFF;line-height:19px;background-color:#F3F1F1;color:#197CAE;font-size:14px}
#tab span TAB与TAB之间的分割符“|”{color:#FFFFFF;font-size:14px}
#tab a:link TAB未选中状态{color:#FFFFFF;text-decoration:none;font-size:14px}
#tab a:visited{color:#FFFFFF;text-decoration:none;font-size:14px}
#tab2 设置TAB菜单主体{background:#DAE9F5}
#tab2 span TAB选中状态{color:#000000;font-size:12px;font-weight:bold}
#tab2 a TAB未选中状态{font-size:12px}
#tab2 a:link{color:#0000CC}
#tab2 a:visited{color:#0000CC}

--------------------------------------------------------------------------------

.stage 内容区域（TAB菜单与版权信息之间的区域）{background:#F3F1F1}

其它区域（即访问量等信息）
#comm_info 主体{color:#333333;font-family:Arial;text-align:left}
#comm_info div.line 分界线{margin-top:5px;line-height:8px;border-top:1px solid #D2E9F4}
#comm_info a 链接{color:#3399CC}

--------------------------------------------------------------------------------

页码区域
#page 主体{height:30px;font-size:14px;font-family:Arial;text-align:center}
#page span 当前页码（不可点击）{padding:3px;color:#000000;font-size:14px;font-weight:bold}
#page a.pc 上一页和下一页{color:#3399CC;font-size:14px;font-weight:bold}
#page a.pc:visited{color:#3399CC}
#page a.pi 页码（可点击）{padding:3px;color:#3399CC;font-size:14px}
#page a.pi:visited{color:#3399CC}

--------------------------------------------------------------------------------

模块
.mod {margin-bottom:10px}
.modhandle{cursor:move}
.modth 模块标题栏主体{height:24px}
.modhead{padding:4px 4px 0 4px}
.modopt 模块操作区（如写新文章）{padding:4px 4px 0 0}
.modtit 模块标题区（如文章列表）{color:#FFFFFF;font-size:12px;font-weight:bold}a.modtit{color:#FFFFFF}a.modtit:visited{color:#FFFFFF}
.modtitlink{color:#FFFFFF;font-size:12px;font-weight:bold}a.modtitlink{color:#FFFFFF;text-decoration:none}a.modtitlink:visited{color:#FFFFFF;text-decoration:none}a.modtitlink:hover{color:#FF5100;text-decoration:underline}
.modact 操作文字链接（如文章列表）{color:#FFFFFF;font-size:12px}a.modact:link{color:#FFFFFF}a.modact:visited{color:#FFFFFF}
.modbox 模块内容区{padding:10px 10px 0 10px;background-color:#FFFFFF}
.modtl 模块左上角背景{background:url(temp1/ptitl.gif) no-repeat top left;line-height:1px}
.modtc 模块中上背景{background:url(temp1/ptitc.gif) repeat-x}
.modtr 模块右上角背景{background:url(temp1/ptitr.gif) no-repeat top right;line-height:1px}
.modbl 模块左下角背景{background-color:#FFFFFF;line-height:1px}
.modbc 模块中下背景{background-color:#FFFFFF;line-height:1px}
.modbr 模块右下角背景{background-color:#FFFFFF;line-height:1px}

--------------------------------------------------------------------------------

文章区域
#m_blog div.tit 文章标题{font-size:14px;font-weight:bold}
#m_blog div.tit a 文章标题链接{color:#333333;font-size:14px;font-weight:bold}
#m_blog div.tit a:visited{color:#333333}
#m_blog div.date 文章发表日期{margin:5px 0 8px 0;color:#666666}
#m_blog div.cnt 文章内容{color:#333333;line-height:20px;font-size:14px}
#m_blog div.more{margin:14px 0 16px 0}
#m_blog div.more a 阅读全文链接{color:#3399CC;font-size:14px}
#m_blog div.more a:visited{color:#3399CC}
#m_blog div.opt 文章操作区（如编辑、评论等）{color:#666666;font-size:12px}
#m_blog div.opt a 文章操作链接{color:#3399CC;font-size:12px}
#m_blog div.opt a:visited{color:#3399CC}
#m_blog div.line 分界线{margin-top:17px;line-height:17px;border-top:1px solid #D2E9F4}
#m_blog div.none 无文章提示信息{padding:100px 0 100px 0;color:#333333;font-size:14px}

--------------------------------------------------------------------------------

个人档案区域
#m_pro a 链接{color:#3399CC}
#m_pro a:visited{color:#3399CC}
#m_pro div.image 个人头像{text-align:center}
#m_pro div.act 操作区（如加为好友、发送消息）{margin-top:10px}
#m_pro div.user 用户名{margin-top:10px;color:#333333;font-size:12px;font-weight:bold}
#m_pro div.desc 用户简介{color:#333333;font-size:12px}
#m_pro div.line 分界线{margin-top:17px;line-height:17px;border-top:1px solid #D2E9F4}
#m_pro td{color:#333333;line-height:24px;font-size:14px}

--------------------------------------------------------------------------------

相册区域
#m_album div.image 照片{text-align:center}
#m_album div.page {color:#666666;font-size:12px;text-align:center}
#m_album div.page a{color:#0000CC;font-size:12px}
#m_album div.page a:visited{color:#0000CC}

--------------------------------------------------------------------------------

友情链接区域
#m_links div.item 子项{color:#333333;font-size:12px}
#m_links div.item a 名称（链接）{color:#3399CC;font-size:12px;text-decoration:none}
#m_links div.item a:visited{color:#3399CC}
#m_links div.line 分界线{margin-top:5px;line-height:8px;border-top:1px solid #D2E9F4}

--------------------------------------------------------------------------------

文章分类
#m_artclg div.item 子项{color:#666666;font-size:12px}
#m_artclg div.item a 分类名称（链接）{color:#3399CC;font-size:12px}
#m_artclg div.item a:visited{color:#3399CC}
#m_artclg div.line 分界线{margin-top:5px;line-height:8px;border-top:1px solid #D2E9F4}

--------------------------------------------------------------------------------

最新评论区域
#m_comment div.item 子项{color:#333333;font-size:12px}
#m_comment div.item a 发表人（链接）{color:#3399CC;font-size:12px}
#m_comment div.item a:visited{color:#3399CC}
#m_comment div.item a.cnt 评论摘要（链接）{color:#333333;font-size:12px;text-decoration:none}
#m_comment div.item a.cnt:visited{color:#333333;text-decoration:none}
#m_comment div.item a.cnt:hover{color:#333333;text-decoration:underline}
#m_comment div.line 分界线{margin-top:5px;line-height:8px;border-top:1px solid #D2E9F4}

--------------------------------------------------------------------------------

相册列表
#m_albumlist div.note{color:#333333;font-size:14px}
#m_albumlist div.desc 简介{margin-bottom:12px;padding:3px 10px 3px 10px;line-height:22px;background-color:#F2F2F2;font-size:14px}
#m_albumlist div.none 无照片提示信息{padding:100px 0 100px 0;color:#333333;font-size:14px}
#m_albumlist div.line 分界线{margin-top:10px;line-height:16px;border-top:1px solid #D2E9F4}
#m_albumlist div.tit 照片标题{margin:6px 0 7px 0;color:#333333;font-size:14px}
#m_albumlist div.tit a 照片标题链接{color:#3399CC;font-size:14px}
#m_albumlist div.tit a:visited{color:#3399CC}
#m_albumlist span.count 照片数量{color:#666666;font-size:12px;font-weight:bold}
#m_albumlist span.size 照片尺寸{color:#999999;font-size:12px;font-family:Arial}
#m_albumlist a.act 操作区链接（如编辑、删除）{color:#3399CC;font-size:12px}
#m_albumlist a.act:visited{color:#3399CC}
#m_albumlist a.page 页码链接{color:#0000CC;font-size:14px}
#m_albumlist a.page:visited{color:#0000CC}
#m_albumlist td.image{padding:5px;border:1px solid #999999;background:#FFFFFF}

--------------------------------------------------------------------------------

好友列表
#m_friend div.filter{margin-bottom:10px;padding-left:10px;padding-top:10px;height:27px;line-height:27px}
#m_friend div.catalog{margin-bottom:10px;padding-left:10px;height:27px;line-height:27px;background-color:#F2F2F2;font-size:14px}
#m_friend div.user{margin-top:4px;color:#333333;font-size:12px}
#m_friend div.user a 好友名称（链接）{color:#3399CC;font-size:12px}
#m_friend div.user a:visited{color:#3399CC}
#m_friend div.line 分界线{margin-top:10px;line-height:16px;border-top:1px solid #D2E9F4}

--------------------------------------------------------------------------------

设置访问统计、模板设置
#m_setting a 链接{color:#3399CC}
#m_setting a:visited{color:#3399CC}
#m_setting 主体{line-height:22px;color:#333333;font-size:14px}
#m_setting img.sel 模板预览图（选中状态）{border:4px solid #FFDB7B}
#m_setting img.unsel 模板预览图（未选中状态）{border:1px solid #D2D2D2}
#m_setting span.tit 模板标题名称{font-size:14px}
#m_setting span.usr 作者名{color:#666666}
#m_setting div.sel “当前模板”文字{padding-top:6px;font-size:14px;font-weight:bold}
#m_setting div.line 分界线{margin-top:20px;line-height:16px;border-top:1px solid #D2E9F4}

--------------------------------------------------------------------------------

系统公告
#m_sysinfo a 链接{color:#3399CC}
#m_sysinfo a:visited{color:#3399CC}
#m_sysinfo 主体{line-height:22px;color:#333333;font-size:14px}
#m_sysinfo span.new 最新{color:#FF0000;font-size:10px;font-family:Arial}
#m_sysinfo span.date 发布时间{color:#666666;font-size:14px}

--------------------------------------------------------------------------------

基本选项
#m_setbase 主体{color:#333333;font-size:14px}
#m_setbase td{color:#333333;font-size:14px}
#m_setbase div.line 分界线{margin-top:5px;line-height:8px;border-top:1px solid #D2E9F4}

--------------------------------------------------------------------------------

网友评论
#in_comment 主体{width:710px}
#in_comment div.tit 标题{margin-bottom:12px;color:#333333;font-size:14px;font-weight:bold}
#in_comment div.user 发表人名{margin-bottom:6px;color:#333333;font-size:12px}
#in_comment div.user a 发表人名（链接）{color:#3399CC;font-size:12px}
#in_comment div.user a:visited{color:#3399CC}
#in_comment div.user span.date 发表时间{color:#666666;font-size:12px}
#in_comment div.desc 评论内容{color:#333333;font-size:12px}
#in_comment div.line 分界线{margin-top:17px;line-height:17px;border-top:1px solid #D2E9F4}
#in_send div.tit 发表评论（标题）{margin:10px 0 10px 0;color:#333333;font-size:14px;font-weight:bold}

内容总结

以上是互联网集市为您收集整理的空间页面CSS说明_CSS/HTML全部内容，希望文章能够帮你解决空间页面CSS说明_CSS/HTML所遇到的程序开发问题。如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/415408.html

来源：【匿名】

【上一篇】用CSS实现鼠标单击特效_CSS/HTML 【下一篇】PHP 和 HTML

更多 ►

【空间页面CSS说明_CSS/HTML】教程文章相关的互联网学习教程文章

sublime text3如何格式化css\html代码【图】

1.了解CodeFormatter插件在Sublime Text 3中编写代码，为了能让我们的代码格式变得漂亮整洁，需要一个能自动格式代码的插件。这里发现CodeFormatter插件不错，它能支持常见的几种编程语言：* PHP * JavaScript/JSON * HTML* CSS * SCSS * Python* Visual Basic/VBScript* Coldfusion/Railo/Lucee2.安装CodeFormatter插件在启动Sublime Text 3程序后，使用快捷键 “ Ctl+Shift+P ”，再选择 "Package Control: Install Pack...

【css】--html,body 设置 min-height无效【代码】

html,body{min-height}; 无效无效的原因应该就是没有对比元素，解决方法：html{height:100%; } body{min-height:100% }原文：https://www.cnblogs.com/zjt-blogs/p/12118249.html

css+html菜单适应性学习的宽度【图】

本文就是利用css和html自适应于文本菜单的长度。后效果图实现，例如下列：实现代码例如以下：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html><head><title>menu4.html</title><meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="this is my page"><meta http-equiv="content-type" content="text/html; charset=UTF-8"><!--<link rel="styleshe...

css与html常见的三种结合方式示例介绍

复制代码代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <link rel="stylesheet" type="text/css" href="Demo.css"></link> <!-- css与html的结合方式: 一、内联样式在开始标签内部关联：即在styel属性里面写CSS代码。优点：直接，很...

js,css 和 html 分离，见仁见智

信经常观察大站的朋友都会发现，他们都把CSS写在HMTL页面里，一个页面的或者多个页面的背景图片，都集成到一张图片里，他们有的JS文件，也写到页面里了……也许你会迷惑，现在到处讲页面的优化，不都是要把CSS、JS都独立出来，然后掉用吗？大站这样的做法岂不是不利于SEO？难道他们真的不懂SEO吗？下面，我就给大家详细解释下其中原因。首先，我们访问网站的时候，会对服务器发出HTTP请求，网站打开的快慢，处理与页面的大小图...

css与html相关标签

meta标签：META标签是HTML语言HEAD区的一个辅助性标签，它位于HTML文档头部的标记和标题标记之间，它提供用户不可见的信息。meta标签通常用来为搜索引擎robots定义页面主题，或者是定义用户浏览器上的cookie；它可以用于鉴别作者，设定页面格式，标注内容提要和关键字；还可以设置页面使其可以根据你定义的时间间隔刷新自己，以及设置RASC内容等级，等等。META标签分两大部分：HTTP标题信息（HTTP-EQUIV）和页面描述信息（NAME）。...

CSS和HTML的一些事【代码】

CSS层叠样式表CSS注释格式/**/ html注释标签是 添加样式三种方法：优先级降低1写在元素标签里，行内样式{<p style="font-size:12px;">XXX</p>}会覆盖嵌入样式和链接样式2嵌入样式是style里的,写在head之间。p{color:red;} 加上style标签的话链接样式便不会被加载3链接样式也是在head之间，<link href="style.css" rel="stylesheet" type="text/css">4写在其他样式之前否则不被加载@import url(css/styles2.css) 但是嵌...

css+html实现自适应宽度的菜单学习【图】

本文是利用css和html实现自适应于文本长度菜单。实现后的效果图，如下：实现代码如下：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html><head><title>menu4.html</title><meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="this is my page"><meta http-equiv="content-type" content="text/html; charset=UTF-8"><!--<link rel="stylesheet" ty...

js、css、html判断浏览器的各种版本

利用正则表达式来判断ie浏览器版本判断是否IE浏览器 if (document.all) { alert("这个是ie浏览器");} 判断是否IE6浏览器方法一：if ( /MSIE 6.0/ig.test(navigator.appVersion) ) {alert("这个是ie6浏览器");} 或 /MSIE 8/.test(navigator.appVersion) 方法二： var IE = !+‘\v1‘; IE6 = IE && ([/MSIE(\d)\.0/i.exec(navigator.userAgent)][0][1] == 6) 判断是否IE7浏览器 if ( /MSIE 7.0/ig.test(navigator.appVersion) ) {a...

0基础学习前段历程2 第一门需要掌握的前端技术HTML5+CSS3 html基础知识 html5新增标签

css+html+js实现下拉及多级弹出菜单【图】

本文将使用css+html+js实现横向菜单，具有下拉的多级弹出菜单。首先我们来看看效果图：首先应该写html部分的代码，代码比较简单，代码如下：<body><div id="menu"><ul><li><a href="#" id="current">首页</a></li><li><a href="#">网页版式</a><ul><li><a href="#">自适应宽度</a></li><li><a href="#">固定宽度</a></li></ul></li><li><a href="#">web教程</a><ul><li><a href="#">新手入门</a></li><li><a href="#">视频教程</a>...

HTML - 技术教程分类

HTML 教程 HTML 简介 HTML 编辑器 HTML 基础 HTML 元素 HTML 属性 HTML 标题 HTML 段落 HTML 文本格式化 HTML 链接 HTML 头部 HTML CSS HTML 图像 HTML 表格 HTML 列表 HTML 区块 HTML 布局 HTML 表单 HTML 框架 HTML 颜色 HTML 颜色名 HTML 颜色值 HTML 脚本 HTML 字符实体 HTML URL HTML 速查列表 HTML 总结 XHTML 简介 HTML 媒体(Media) HTML 插件 HTML 实例 HTML 标签列表（功能排序） HTML 属性 HTML 事件 HTML 画布 HTML 音频/视频 HTML 颜色名 HTML 字符集 HTML ASCII HTML ISO-8859-1 HTML 符号 HTML 语言代码 html 全部

HTML - 最热教程

html5代码如何实现进度条功能？（示例）javascript中html字符串转化为jquerydo...HTML5实战与剖析之CSS选择器——getEle...html5中设置或返回音频/视频是否应该被...HTML5获取设备信息 jQuery打印指定区域Html页面并自动分页...jQuery+HTML5+CSS3制作支持响应式布局时...JS+HTML5实现上传图片预览效果完整实例...php删除html标签和标签内的内容的方法总...XMLHttpRequest中responseText如何获取...

首页 / HTML / 空间页面CSS说明_CSS/HTML

空间页面CSS说明_CSS/HTML

内容导读

内容图文

内容总结

内容备注

内容手机端

【空间页面CSS说明_CSS/HTML】教程文章相关的互联网学习教程文章

sublime text3如何格式化css\html代码【图】

【css】--html,body 设置 min-height无效【代码】

css+html菜单适应性学习的宽度【图】

css与html常见的三种结合方式示例介绍

js,css 和 html 分离，见仁见智

css与html相关标签

CSS和HTML的一些事【代码】

css+html实现自适应宽度的菜单学习【图】

js、css、html判断浏览器的各种版本

0基础学习前段历程2 第一门需要掌握的前端技术HTML5+CSS3 html基础知识 html5新增标签

css+html+js实现下拉及多级弹出菜单【图】

CSS：自定多姿多彩的网页链接下划线_CSS/HTML

CSS的expression使用简介_CSS/HTML

CSS中div、span和center元素_CSS/HTML

CSS基础学习_CSS/HTML

HTML - 相关标签

CSS - 相关标签

HTML - 技术教程分类

HTML - 最新教程

HTML - 最热教程