From 08149f6f0c42c2192a51e64af357f6cbd07de91c Mon Sep 17 00:00:00 2001 From: IE-WEB <1472343820@qq.com> Date: Mon, 16 Dec 2024 15:53:40 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E6=B3=A8=E9=87=8A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- base.css | 415 +++++++++++++++++++++++++++++++++++++++++++++++- cont.css | 159 +++++++++++-------- index.css | 70 ++++---- qiantai.css | 449 ++++++++++++++++++++-------------------------------- 4 files changed, 715 insertions(+), 378 deletions(-) diff --git a/base.css b/base.css index f685c54..93f220b 100644 --- a/base.css +++ b/base.css @@ -1,6 +1,6 @@ * { font-size: 12px; - font-family: ""; + font-family: " "; } td { line-height: 1.5; } @@ -8,7 +8,7 @@ td { line-height: 1.5; } body { font-size: 12px; line-height: 1.5; - font-family: ""; + font-family: " "; } form,h1,h2,h3,ul,ol,div{ margin: 0; padding:0;} @@ -34,9 +34,9 @@ h1 { color:#171B16; font-size:130%; font-weight:bold; } h2 { color:#171B16; font-size:115%; font-weight:bold; } h3 { color:#171B16; font-size:100%; font-weight:bold;} -a:link { font-size: 9pt; color: #000000; text-decoration: none; font-family: """"; } -a:visited{ font-size: 9pt; color: #000000; text-decoration: none; font-family: """"; } -a:hover {color: red; font-family: """";} +a:link { font-size: 9pt; color: #000000; text-decoration: none; font-family: "" ""; } +a:visited{ font-size: 9pt; color: #000000; text-decoration: none; font-family: "" ""; } +a:hover {color: red; font-family: "" "";} a img { border-style:none; } b a { @@ -54,7 +54,7 @@ a strong{ } input { border: 1px solid #ababab; } -/*.aΪ*/ +/*.aΪ */ .pubinputs { height: 22px; width:250px; @@ -281,7 +281,410 @@ border:1px solid #ffffff; .tblist td{ background:#FFFFFF; padding:6px; +}/* 通用样式 */ +* { + font-size: 12px; /* 设置默认字体大小为12px */ + font-family: ""; /* 设置默认字体（未指定具体字体） */ +} + +td { + line-height: 1.5; /* 设置表格单元格的行高为1.5 */ +} + +/* 设置页面的基础字体样式 */ +body { + font-size: 12px; /* 设置全局字体大小 */ + line-height: 1.5; /* 设置行高 */ + font-family: ""; /* 设置全局字体（未指定具体字体） */ +} + +/* 重置一些常见的元素的 margin 和 padding */ +form, h1, h2, h3, ul, ol, div { + margin: 0; /* 去除外边距 */ + padding: 0; /* 去除内边距 */ +} + +/* 设置表格单元格的文字换行方式 */ +td, th, div { + word-break: break-all; /* 强制长单词在任意位置断开换行 */ + word-wrap: break-word; /* 在单词内强制换行 */ +} + +/* 强调标签的字体颜色 */ +b, strong { + color: #666600; /* 设置粗体文字颜色为深黄色 */ +} + +/* 去除列表项的默认样式 */ +li, dd { + list-style-type: none; /* 去除列表标记 */ + margin: 0px; /* 去除外边距 */ + padding: 0px; /* 去除内边距 */ +} + +/* 设置按钮样式 */ +input[type=button] { + background-color: #F1F8B4; /* 设置按钮背景色为浅黄色 */ +} + +/* 标题样式 */ +h1 { + color: #171B16; /* 设置h1的颜色为深色 */ + font-size: 130%; /* 设置h1字体大小为130% */ + font-weight: bold; /* 设置h1加粗 */ +} + +h2 { + color: #171B16; /* 设置h2的颜色为深色 */ + font-size: 115%; /* 设置h2字体大小为115% */ + font-weight: bold; /* 设置h2加粗 */ +} + +h3 { + color: #171B16; /* 设置h3的颜色为深色 */ + font-size: 100%; /* 设置h3字体大小为100% */ + font-weight: bold; /* 设置h3加粗 */ +} + +/* 设置链接的样式 */ +a:link { + font-size: 9pt; /* 设置未访问链接的字体大小 */ + color: #000000; /* 设置未访问链接的字体颜色为黑色 */ + text-decoration: none; /* 去除下划线 */ + font-family: ""; /* 设置链接字体（未指定具体字体） */ +} + +a:visited { + font-size: 9pt; /* 设置已访问链接的字体大小 */ + color: #000000; /* 设置已访问链接的字体颜色为黑色 */ + text-decoration: none; /* 去除下划线 */ + font-family: ""; /* 设置链接字体（未指定具体字体） */ +} + +a:hover { + color: red; /* 鼠标悬停时，链接颜色变为红色 */ + font-family: ""; /* 设置悬停时字体（未指定具体字体） */ +} + +a img { + border-style: none; /* 去除链接中的图片边框 */ +} + +/* 让链接中的 b 和 strong 元素也使用相同的颜色 */ +b a { + color: #666600; /* 设置链接中的b标签颜色 */ +} + +strong a { + color: #666600; /* 设置链接中的strong标签颜色 */ +} + +a b { + color: #666600; /* 设置链接中的b标签颜色 */ +} + +a strong { + color: #666600; /* 设置链接中的strong标签颜色 */ +} + +/* 输入框样式 */ +input { + border: 1px solid #ababab; /* 设置输入框的边框为浅灰色 */ +} + +/* 公共输入框样式 */ +.pubinputs { + height: 22px; /* 设置输入框高度 */ + width: 250px; /* 设置输入框宽度 */ + padding: 4px 3px 2px 3px; /* 设置内边距 */ + border-width: 1px; /* 设置边框宽度 */ + border-style: solid; /* 设置边框样式为实线 */ + border-color: #999999 #dddddd #dddddd #999999; /* 设置四个边框的颜色 */ +} + +/* 普通输入框样式 */ +.iptxt { + height: 22px; /* 设置输入框高度 */ + padding: 4px 3px 2px 3px; /* 设置内边距 */ + border-width: 1px; /* 设置边框宽度 */ + border-style: solid; /* 设置边框样式为实线 */ + border-color: #999999 #dddddd #dddddd #999999; /* 设置四个边框的颜色 */ +} + +/* 包含文本框样式 */ +.alltxt { + padding: 4px 3px 2px 3px; /* 设置内边距 */ + border-width: 1px; /* 设置边框宽度 */ + border-style: solid; /* 设置边框样式为实线 */ + border-color: #999999 #dddddd #dddddd #999999; /* 设置四个边框的颜色 */ +} + +/* 具有特定样式的输入框 */ +.pubinput { + height: 24px; /* 设置输入框高度 */ + width: 250px; /* 设置输入框宽度 */ + padding-top: 3px; /* 设置顶部内边距 */ + padding-bottom: 0px; /* 设置底部内边距 */ +} + +.pubinputl { + height: 24px; /* 设置输入框高度 */ + width: 350px; /* 设置输入框宽度 */ + padding-top: 3px; /* 设置顶部内边距 */ + padding-bottom: 0px; /* 设置底部内边距 */ +} + +/* 没有边框的样式 */ +.np { + border: none; /* 去除边框 */ +} + +/* 表格中每一行的下边框 */ +.linerow { + border-bottom: 1px solid #ACACAC; /* 设置下边框为1px灰色实线 */ +} + +/* 按钮的样式 */ +.coolbg { + border-right: 1px solid #ACACAC; /* 设置右边框 */ + border-bottom: 1px solid #ACACAC; /* 设置底边框 */ + background-color: #F1F8B4; /* 设置背景色 */ + padding: 2px; + padding-right: 5px; /* 设置右内边距 */ + padding-left: 5px; /* 设置左内边距 */ + background: url(allbtbg2.gif) #EFF7D0; /* 设置背景图片和背景色 */ + cursor: pointer; /* 设置鼠标悬停时的光标样式为手形 */ +} + +/* 按钮的样式 */ +.coolbg2 { + border: 1px solid #000000; /* 设置边框为黑色 */ + background-color: #DFDDD2; /* 设置背景色为浅灰色 */ + height: 18px; /* 设置高度 */ +} + +/* 列表项的样式 */ +.ll { + border-right: 2px solid #ACACAC; /* 设置右边框 */ + border-bottom: 2px solid #ACACAC; /* 设置底边框 */ + background-color: #E6E6E6; /* 设置背景色 */ +} + +/* 具有虚线下边框的样式 */ +.bline { + border-bottom: 1px dotted #BCBCBC; /* 设置虚线底边框 */ + height: 28px; /* 设置高度 */ + background-color: #FFFFFF; /* 设置背景色为白色 */ } + +/* 上传字段的浮动样式 */ +#uploadfield { + float: left; /* 设置浮动到左侧 */ +} + +/* 具有实线下边框的样式 */ +.bline2 { + border-bottom: 1px solid #BCBCBC; /* 设置实线底边框 */ +} + +/* 按钮的样式 */ +.coolbt { + border-left: 1px solid #EFEFEF; /* 设置左边框 */ + border-top: 1px solid #EFEFEF; /* 设置上边框 */ + border-right: 1px solid #ACACAC; /* 设置右边框 */ + border-bottom: 1px solid #ACACAC; /* 设置底边框 */ + background-color: #E4F7D7; /* 设置背景色 */ + cursor: pointer; /* 设置鼠标悬停时的光标样式为手形 */ +} + +/* 另一个按钮的样式 */ +.coolbt2 { + border-left: 1px solid #EFEFEF; /* 设置左边框 */ + border-top: 1px solid #EFEFEF; /* 设置上边框 */ + border-right: 1px solid #ACACAC; /* 设置右边框 */ + border-bottom: 1px solid #ACACAC; /* 设置底边框 */ + background-color: #F7FCDA; /* 设置背景色 */ +} + +/* 另一个样式的按钮 */ +.coolbg3 { + border: 1px solid #BDC5B4; /* 设置边框 */ + background-color: #DFDDD2; /* 设置背景色 */ + height: 20px; /* 设置高度 */ + width: 140px; /* 设置宽度 */ + text-align: right; /* 设置文字右对齐 */ +} + +/* 样式定义 */ +.coolbg61 { + line-height: 26px; /* 设置行高 */ + width: 380px; /* 设置宽度 */ + border-top: 1px solid #BDC5B4; /* 设置上边框 */ + border-left: 1px solid #BDC5B4; /* 设置左边框 */ + border-right: 1px solid #BDC5B4; /* 设置右边框 */ + height: 26px; /* 设置高度 */ + text-align: right; /* 设置文字右对齐 */ + background-color: #E7F3B1; /* 设置背景色 */ +} + +.coolbg62 { + border: 1px solid #BDC5B4; /* 设置边框 */ + background-color: #F8FDF0; /* 设置背景色 */ + height: 300px; /* 设置高度 */ + width: 380px; /* 设置宽度 */ + padding: 5px; /* 设置内边距 */ +} + +/* 另一种背景样式 */ +.coolbg4 { + border-bottom: 1px solid #C9CFC1; /* 设置底边框 */ + background-color: #EDEBE5; /* 设置背景色 */ + height: 20px; /* 设置高度 */ + width: 190px; /* 设置宽度 */ + text-align: right; /* 设置文字右对齐 */ +} + +/* 背景颜色和边框的样式 */ +.coolbg5 { + border-top: 1px solid #BDC5B4; /* 设置上边框 */ + background-color: #EDEBE5; /* 设置背景色 */ + font-size: 1pt; /* 设置字体大小 */ + height: 6px; /* 设置高度 */ + width: 190px; /* 设置宽度 */ +} + +/* 弹窗样式 */ +.dlg { + border: 2px solid #749F4D; /* 设置边框 */ + background-color: #F0FAEB; /* 设置背景色 */ + padding: 2px; /* 设置内边距 */ + width: 360px; /* 设置宽度 */ + line-height: 160%; /* 设置行高 */ +} + +/* 样式定义 */ +.dlgws { + border: 2px solid #749F4D; /* 设置边框 */ + background-color: #F0FAEB; /* 设置背景色 */ + padding: 2px; /* 设置内边距 */ + width: 280px; /* 设置宽度 */ + line-height: 160%; /* 设置行高 */ +} + +.dlgws div { + width: 100%; /* 设置宽度 */ +} + +/* 测试标题样式 */ +.dlgTesttitle { + border: 2px solid #749F4D; /* 设置边框 */ + background-color: #F0FAEB; /* 设置背景色 */ + padding: 2px; /* 设置内边距 */ + width: 200px; /* 设置宽度 */ + line-height: 150%; /* 设置行高 */ +} + +/* 样式定义 */ +#_mysource { + z-index: 5000; /* 设置z-index */ +} + +#_mywriter { + z-index: 6000; /* 设置z-index */ +} + +/* 样式定义 */ +.option1 { + background-color: #DCECA6; /* 设置背景色 */ +} + +.option2 { + background-color: #F7FBD2; /* 设置背景色 */ +} + +.option3 { + background-color: #FFFFFF; /* 设置背景色 */ +} + +/* 输入框样式 */ +.ininput { + width: 96%; /* 设置宽度 */ + height: 20px; /* 设置高度 */ + border: 1px solid #ffffff; /* 设置白色边框 */ +} + +/* 按钮样式 */ +.nbt { + padding: 1px; /* 设置内边距 */ + background-image: url('allbtbg.gif'); /* 设置背景图片 */ + background-color: #ffffff; /* 设置背景色 */ + border: 1px solid #A5AF83; /* 设置边框 */ +} + +/* 设置表格标题 */ +.tdt { + padding-left: 6px; /* 设置左内边距 */ +} + +/* 页面等待样式 */ +.waitpage { + top: 0; /* 设置顶部位置 */ + left: 0; /* 设置左侧位置 */ + filter: Alpha(opacity=70); /* 设置透明度 */ + -moz-opacity: 0.7; /* 设置透明度 */ + position: absolute; /* 设置绝对定位 */ + z-index: 10000; /* 设置层级 */ +} + +/* 样式定义 */ +.divpre { + filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale); /* 设置透明度 */ +} + +/* 自动输入框样式 */ +.autoinput { + padding-left: 3px; /* 设置左内边距 */ + width: 90%; /* 设置宽度 */ + height: 22px; /* 设置高度 */ +} + +/* 标题样式 */ +.bodytitle { + margin: auto; /* 设置自动外边距 */ + height: 28px; /* 设置高度 */ + border: 1px dotted #BFD67C; /* 设置虚线边框 */ + background: url('wbg.gif'); /* 设置背景图片 */ + margin-bottom: 6px; /* 设置底部外边距 */ + width: 98%; /* 设置宽度 */ + font-weight: bold; /* 设置字体加粗 */ +} + +.bodytitle div { + float: left; /* 设置浮动为左 */ +} + +/* 标题文本样式 */ +.bodytitletxt { + padding-left: 6px; /* 设置左内边距 */ + line-height: 28px; /* 设置行高 */ +} + +/* 设置表格标题 */ +.tbtitle td { + padding: 3px; /* 设置单元格内边距 */ +} + +/* 列表样式 */ +.tblist td { + background: #FFFFFF; /* 设置背景色为白色 */ + padding: 6px; /* 设置内边距 */ +} + +.tblist td.tbsname { + background: #F9FFE6; /* 设置背景色 */ + padding: 6px; /* 设置内边距 */ +} + .tblist td.tbsname{ background:#F9FFE6; padding:6px; diff --git a/cont.css b/cont.css index f48dfa1..6c8cb93 100644 --- a/cont.css +++ b/cont.css @@ -1,110 +1,131 @@ /* CSS Document */ +/* Body样式 */ body{ - padding:0px; - margin:0px; - font-size:12px; + padding:0px; /* 设置body的内边距为0 */ + margin:0px; /* 设置body的外边距为0 */ + font-size:12px; /* 设置默认字体大小为12px */ } -/*==========TOPҳ==========*/ + +/*==========TOP部分（头部区域）==========*/ .top_tab{ - background-image:url(/dingcan/images/top_01.gif); - background-repeat:repeat-x; - height:90px; - width:100%; + background-image:url(/dingcan/images/top_01.gif); /* 设置背景图片 */ + background-repeat:repeat-x; /* 背景图片水平重复 */ + height:90px; /* 设置顶部高度为90px */ + width:100%; /* 设置顶部宽度为100% */ } + .top_logo{ - width:197px; - background-image:url(/dingcan/images/top_02.gif); + width:197px; /* 设置logo宽度为197px */ + background-image:url(/dingcan/images/top_02.gif); /* 设置logo的背景图片 */ } + .top_tex{ - background:url(/dingcan/images/top_03.gif) no-repeat; + background:url(/dingcan/images/top_03.gif) no-repeat; /* 设置top_tex区域的背景图片，且不重复 */ } + .top_r{ - width:361px; - background:url(/dingcan/images/top_05.gif) no-repeat; + width:361px; /* 设置右侧区域宽度为361px */ + background:url(/dingcan/images/top_05.gif) no-repeat; /* 设置右侧区域的背景图片，不重复 */ } -/*==========Ҳҳ(ʾ)==========*/ + +/*========== 右侧部分（右侧内容区域）==========*/ .right_body{ - padding-left:5px; - padding-right:5px; + padding-left:5px; /* 设置右侧内容区左内边距为5px */ + padding-right:5px; /* 设置右侧内容区右内边距为5px */ } + .right_font{ - font-size:13px; - cursor:hand; + font-size:13px; /* 设置字体大小为13px */ + cursor:hand; /* 设置鼠标悬停时变为手形 */ } -/*==========еͼƬȫдCSS,Ϊɫ汾==========*/ + +/*========== 内容区域样式（表格样式）==========*/ .cont_tab{ - background-color:#4374A3; + background-color:#4374A3; /* 设置背景颜色为深蓝色 */ } + .cont_tab_l{ - background-image:url(/dingcan/images/r_14.gif); - background-repeat:no-repeat; - width:12px; - height:13px; + background-image:url(/dingcan/images/r_14.gif); /* 设置左边区域的背景图片 */ + background-repeat:no-repeat; /* 背景不重复 */ + width:12px; /* 设置宽度为12px */ + height:13px; /* 设置高度为13px */ } + .cont_tab_m{ - background-image:url(/dingcan/images/r_16.gif); - background-repeat:repeat-x; - height:13px; - } + background-image:url(/dingcan/images/r_16.gif); /* 设置中间区域的背景图片 */ + background-repeat:repeat-x; /* 背景水平重复 */ + height:13px; /* 设置高度为13px */ +} + .cont_tab_r{ - background-image:url(/dingcan/images/r_14_r.gif); - background-repeat:no-repeat; - width:12px; - height:13px; + background-image:url(/dingcan/images/r_14_r.gif); /* 设置右边区域的背景图片 */ + background-repeat:no-repeat; /* 背景不重复 */ + width:12px; /* 设置宽度为12px */ + height:13px; /* 设置高度为13px */ } + .cont_tab_bl{ - background-image:url(/dingcan/images/r_24.gif); - background-repeat:no-repeat; - width:12px; - height:13px; + background-image:url(/dingcan/images/r_24.gif); /* 设置左下角区域的背景图片 */ + background-repeat:no-repeat; /* 背景不重复 */ + width:12px; /* 设置宽度为12px */ + height:13px; /* 设置高度为13px */ } + .cont_tab_bm{ - background-image:url(/dingcan/images/r_29.gif); - background-repeat:repeat-x; - height:13px; + background-image:url(/dingcan/images/r_29.gif); /* 设置底部区域的背景图片 */ + background-repeat:repeat-x; /* 背景水平重复 */ + height:13px; /* 设置高度为13px */ } + .cont_tab_br{ - background-image:url(/dingcan/images/r_24_r.gif); - background-repeat:no-repeat; - width:12px; - height:13px; + background-image:url(/dingcan/images/r_24_r.gif); /* 设置右下角区域的背景图片 */ + background-repeat:no-repeat; /* 背景不重复 */ + width:12px; /* 设置宽度为12px */ + height:13px; /* 设置高度为13px */ } -/*==========LEFTҳ==========*/ + +/*========== 左侧菜单部分==========*/ .left_b_m{ - line-height:13px; - font-size:1px; + line-height:13px; /* 设置行高为13px */ + font-size:1px; /* 设置字体大小为1px */ } + .left_mid{ - padding-left:2px; - padding-right:1px; + padding-left:2px; /* 设置左侧内边距为2px */ + padding-right:1px; /* 设置右侧内边距为1px */ } + .menu_first_img{ - background-image:url(/dingcan/images/l_b_05.gif); - background-repeat:no-repeat; -}.menu_second_img{ - background-image:url(/dingcan/images/l_b_03.gif); - background-repeat:no-repeat; + background-image:url(/dingcan/images/l_b_05.gif); /* 设置菜单第一项的背景图片 */ + background-repeat:no-repeat; /* 背景不重复 */ } -.mouse{ - cursor:hand; - width:176px; - height:29px; - line-height:29px; +.menu_second_img{ + background-image:url(/dingcan/images/l_b_03.gif); /* 设置菜单第二项的背景图片 */ + background-repeat:no-repeat; /* 背景不重复 */ } + +.mouse{ + cursor:hand; /* 鼠标悬停时变为手形 */ + width:176px; /* 设置宽度为176px */ + height:29px; /* 设置高度为29px */ + line-height:29px; /* 设置行高为29px */ +} + .left{ - background-image:url(/dingcan/images/menu_26.gif); - height:29px; - padding-bottom:4px; + background-image:url(/dingcan/images/menu_26.gif); /* 设置左侧菜单项的背景图片 */ + height:29px; /* 设置高度为29px */ + padding-bottom:4px; /* 设置底部内边距为4px */ } -/*==========Foot==========*/ + +/*========== 页脚部分==========*/ #foot{ - background-color:#4374A3; - height:17px; - font-size:12px; - color:#ffffff; - letter-spacing:3px; - text-align:center; - padding-top:3px; + background-color:#4374A3; /* 设置背景颜色为深蓝色 */ + height:17px; /* 设置高度为17px */ + font-size:12px; /* 设置字体大小为12px */ + color:#ffffff; /* 设置字体颜色为白色 */ + letter-spacing:3px; /* 设置字母间距为3px */ + text-align:center; /* 设置文本居中 */ + padding-top:3px; /* 设置顶部内边距为3px */ } diff --git a/index.css b/index.css index 0286767..a5c1bf7 100644 --- a/index.css +++ b/index.css @@ -1,42 +1,54 @@ /* CSS Document */ +/* Body部分样式 */ body{ - margin:0px; - padding:50px 0px 0px 0px; - background-color:#5c86ad; - font-size:12px; - color:#133B61; + margin:0px; /* 设置页面的外边距为0，去除默认的外边距 */ + padding:50px 0px 0px 0px; /* 设置页面的内边距，上边距为50px，其他边距为0 */ + background-color:#5c86ad; /* 设置背景颜色为淡蓝色 */ + font-size:12px; /* 设置字体大小为12px */ + color:#133B61; /* 设置文字颜色为深蓝色 */ } -/*indexҳCSS*/ + +/* Index页面部分样式 */ + +/* tab1的样式 */ .tab1{ - background-image:url(/dingcan/images/dx_01.gif); - background-repeat:no-repeat; - height:160px; - width:708px; + background-image:url(/dingcan/images/dx_01.gif); /* 设置背景图片 */ + background-repeat:no-repeat; /* 背景不重复 */ + height:160px; /* 设置高度为160px */ + width:708px; /* 设置宽度为708px */ } + +/* tab2的样式 */ .tab2{ - background-image:url(/dingcan/images/dx_02.gif); - background-repeat:no-repeat; - width:273px; - height:200px; - padding-left:335px; - padding-right:90px; - font-size:12px; - letter-spacing: 3px; - color:#18345A; - padding-top:10px; + background-image:url(/dingcan/images/dx_02.gif); /* 设置背景图片 */ + background-repeat:no-repeat; /* 背景不重复 */ + width:273px; /* 设置宽度为273px */ + height:200px; /* 设置高度为200px */ + padding-left:335px; /* 设置左内边距为335px */ + padding-right:90px; /* 设置右内边距为90px */ + font-size:12px; /* 设置字体大小为12px */ + letter-spacing: 3px; /* 设置字母间距为3px */ + color:#18345A; /* 设置字体颜色为深蓝色 */ + padding-top:10px; /* 设置顶部内边距为10px */ } + +/* tab3的样式 */ .tab3{ - background-image:url(/dingcan/images/dx_03.gif); - background-repeat:no-repeat; - width:708px; - height:216px; + background-image:url(/dingcan/images/dx_03.gif); /* 设置背景图片 */ + background-repeat:no-repeat; /* 背景不重复 */ + width:708px; /* 设置宽度为708px */ + height:216px; /* 设置高度为216px */ } + +/* .id 样式，可能用于表单中的输入框或其他元素 */ .id{ - height:18px; - border:1px solid #255FAD; - filter: Alpha(Opacity=60); + height:18px; /* 设置元素高度为18px */ + border:1px solid #255FAD; /* 设置边框颜色为蓝色，宽度为1px，实线 */ + filter: Alpha(Opacity=60); /* 设置透明度为60%，仅适用于IE浏览器 */ } + +/* 输入框悬停效果 */ input:hover{ - background-color:#A0D1FF; -} \ No newline at end of file + background-color:#A0D1FF; /* 设置鼠标悬停时输入框的背景颜色为浅蓝色 */ +} diff --git a/qiantai.css b/qiantai.css index ddc33d2..439b995 100644 --- a/qiantai.css +++ b/qiantai.css @@ -1,424 +1,325 @@ - /* Design by Free CSS Templates http://www.freecsstemplates.org Released for free under a Creative Commons Attribution 2.5 License */ +/* Body 样式 */ body { - margin: 0; - padding: 0; - background: url(/dingcan/images/img01.jpg) repeat-x left top; - font-family: Arial, Helvetica, sans-serif; - font-size: 12px; - color: #66665E; + margin: 0; /* 去除外边距 */ + padding: 0; /* 去除内边距 */ + background: url(/dingcan/images/img01.jpg) repeat-x left top; /* 设置背景图片并让其在横向上平铺 */ + font-family: Arial, Helvetica, sans-serif; /* 设置字体为Arial、Helvetica或sans-serif */ + font-size: 12px; /* 设置字体大小为12px */ + color: #66665E; /* 设置字体颜色为浅灰色 */ } +/* 标题样式（h1, h2, h3） */ h1, h2, h3 { - margin: 0; - text-transform: uppercase; - font-family: "Trebuchet MS", Georgia, "Times New Roman", Times, serif; - font-weight: normal; - color: #0C95C9; + margin: 0; /* 去除外边距 */ + text-transform: uppercase; /* 将文字转换为大写 */ + font-family: "Trebuchet MS", Georgia, "Times New Roman", Times, serif; /* 设置字体系列 */ + font-weight: normal; /* 设置字体重量为正常 */ + color: #0C95C9; /* 设置字体颜色为蓝色 */ } -h1 { font-size: 44px; } - -h2 { font-size: 18px; } - -h3 { } +/* 各级标题的字体大小 */ +h1 { font-size: 44px; } /* h1标题设置为44px */ +h2 { font-size: 18px; } /* h2标题设置为18px */ +/* 段落、无序列表和有序列表的样式 */ p, ul, ol { - margin-top: 0; - line-height: 240%; - text-align: justify; + margin-top: 0; /* 去除上边距 */ + line-height: 240%; /* 设置行高为240% */ + text-align: justify; /* 设置文本对齐为两端对齐 */ } -ul, ol { } +ul, ol { } /* 无特定样式 */ +/* 引用样式 */ blockquote { } -a { color: #0C95C9; } - -a:hover { text-decoration: none; } - -a img { - border: none; -} +/* 链接的样式 */ +a { color: #0C95C9; } /* 设置链接的文字颜色为蓝色 */ +a:hover { text-decoration: none; } /* 鼠标悬停时去除下划线 */ +a img { border: none; } /* 去除图片边框 */ +/* 图片浮动样式 */ img.left { - float: left; - margin: 7px 30px 0 0; + float: left; /* 图片浮动到左侧 */ + margin: 7px 30px 0 0; /* 设置图片的外边距 */ } img.right { - float: right; - margin: 7px 0 0 30px; + float: right; /* 图片浮动到右侧 */ + margin: 7px 0 0 30px; /* 设置图片的外边距 */ } +/* 隐藏水平分隔线 */ hr { display: none; } -.list1 { -} +/* 列表1的样式 */ +.list1 { } .list1 li { - float: left; - line-height: normal; + float: left; /* 列表项浮动到左侧 */ + line-height: normal; } .list1 li img { - margin: 0 30px 30px 0; + margin: 0 30px 30px 0; /* 设置图片的外边距 */ } .list1 li.alt img { - margin-right: 0; + margin-right: 0; /* alt类列表项右边距设置为0 */ } -#wrapper { -} +#wrapper { } -/* Header */ +/* Header 样式 */ -#header-wrapper { -} +/* 头部容器 */ +#header-wrapper { } +/* 头部样式 */ #header { - width: 920px; - height: 45px; - margin: 0 auto; + width: 920px; /* 设置头部的宽度为920px */ + height: 45px; /* 设置头部的高度为45px */ + margin: 0 auto; /* 水平居中 */ } -/* Menu */ - +/* 菜单部分样式 */ #menu { - float: left; - width: 540px; - height: 45px; + float: left; /* 菜单浮动到左侧 */ + width: 540px; /* 设置菜单的宽度为540px */ + height: 45px; /* 设置菜单的高度为45px */ } #menu ul { - margin: 0; - padding: 10px 0px 0px 5px; - list-style: none; - line-height: normal; + margin: 0; + padding: 10px 0px 0px 5px; /* 设置内边距 */ + list-style: none; /* 去除列表项的默认样式 */ + line-height: normal; } #menu li { - display: block; - float: left; + display: block; + float: left; /* 列表项浮动到左侧 */ } #menu a { - display: block; - float: left; - margin-right: 3px; - padding: 3px 8px 2px 8px; - text-decoration: none; - text-transform: capitalize; - font-family: Arial, Helvetica, sans-serif; - font-size: 12px; - color: #FFFFFF; + display: block; + float: left; /* 链接浮动到左侧 */ + margin-right: 3px; + padding: 3px 8px 2px 8px; /* 设置链接内边距 */ + text-decoration: none; /* 去除下划线 */ + text-transform: capitalize; /* 将文字首字母大写 */ + font-family: Arial, Helvetica, sans-serif; /* 设置字体系列 */ + font-size: 12px; /* 设置字体大小为12px */ + color: #FFFFFF; /* 设置字体颜色为白色 */ } -#menu a:hover { text-decoration: underline; } +#menu a:hover { text-decoration: underline; } /* 鼠标悬停时显示下划线 */ #menu .current_page_item a { - height: 20px; - background: #FEC200 url(/dingcan/images/img02.jpg) repeat-x left top; - color: #FFFFFF; + height: 20px; + background: #FEC200 url(/dingcan/images/img02.jpg) repeat-x left top; /* 设置当前页面项的背景颜色和图片 */ + color: #FFFFFF; /* 设置字体颜色为白色 */ } #menu .first { - background: none; + background: none; /* 第一个菜单项无背景 */ } -/* Search */ +/* 搜索框样式 */ #search { - float: right; - width: 305px; - height: 45px; + float: right; /* 搜索框浮动到右侧 */ + width: 305px; /* 设置搜索框的宽度 */ + height: 45px; /* 设置搜索框的高度 */ } #search form { - float: right; - margin: 0; - padding: 12px 30px 0 0; + float: right; /* 表单浮动到右侧 */ + margin: 0; + padding: 12px 30px 0 0; } #search fieldset { - margin: 0; - padding: 0; - border: none; + margin: 0; + padding: 0; + border: none; /* 去除fieldset的边框 */ } #search input { - float: left; - font: 12px Georgia, "Times New Roman", Times, serif; - border: none; + float: left; /* 输入框浮动到左侧 */ + font: 12px Georgia, "Times New Roman", Times, serif; + border: none; /* 去除边框 */ } #search-text { - width: 135px; - height: 18px; - padding: 3px 0 0 5px; - border: 1px solid #333333; - background: #ECF9E4; - color: #000000; + width: 135px; /* 设置输入框宽度 */ + height: 18px; /* 设置高度 */ + padding: 3px 0 0 5px; /* 设置内边距 */ + border: 1px solid #333333; /* 设置边框 */ + background: #ECF9E4; /* 设置背景色 */ + color: #000000; /* 设置字体颜色 */ } #search-submit { - height: 21px; - margin-left: 10px; - padding: 0px 5px; - background: #000000; - color: #FFFFFF; + height: 21px; /* 设置提交按钮高度 */ + margin-left: 10px; /* 设置左边距 */ + padding: 0px 5px; /* 设置内边距 */ + background: #000000; /* 设置背景色为黑色 */ + color: #FFFFFF; /* 设置字体颜色为白色 */ } -/* Page */ - +/* Page样式 */ #page { - width: 920px; - margin: 0 auto; + width: 920px; /* 设置页面宽度为920px */ + margin: 0 auto; /* 页面居中显示 */ } #page-bgtop { - padding-top: 30px; + padding-top: 30px; /* 设置顶部内边距 */ } - /** LOGO */ - +/* LOGO部分样式 */ #logo { - width: 860px; - height: 134px; - margin: 0 auto; - background: url(/dingcan/images/img04.jpg) no-repeat right top; + width: 860px; /* 设置LOGO的宽度 */ + height: 134px; /* 设置LOGO的高度 */ + margin: 0 auto; /* LOGO居中 */ + background: url(/dingcan/images/img04.jpg) no-repeat right top; /* 设置LOGO的背景图片 */ } #logo h1, #logo p { - margin: 0px; - line-height: normal; - text-transform: lowercase; - font-weight: normal; - color: #FFFFFF; + margin: 0px; + line-height: normal; + text-transform: lowercase; + font-weight: normal; + color: #FFFFFF; /* 设置LOGO标题和文本的颜色为白色 */ } #logo p { - text-transform: lowercase; - font-size: 10px; + text-transform: lowercase; /* 设置文本为小写 */ + font-size: 10px; /* 设置字体大小 */ } #logo h1 { - padding-top: 54px; - font-size: 34px; + padding-top: 54px; /* 设置LOGO标题的顶部内边距 */ + font-size: 34px; /* 设置LOGO标题的字体大小 */ } #logo a { - text-decoration: none; - color: #FFFFFF; + text-decoration: none; /* 去除链接下划线 */ + color: #FFFFFF; /* 设置链接颜色为白色 */ } -/* Content */ - +/* Content部分样式 */ #content { - float: right; - width: 658px; - padding-top: 10px; - padding-right: 30px; + float: right; /* 内容浮动到右侧 */ + width: 658px; /* 设置内容区域的宽度 */ + padding-top: 10px; /* 设置顶部内边距 */ + padding-right: 30px; /* 设置右侧内边距 */ } -/* */ - +/* Post部分样式 */ .post { - background: url(/dingcan/images/img07.jpg) repeat-x left bottom; - margin-bottom: 25px; + background: url(/dingcan/images/img07.jpg) repeat-x left bottom; /* 设置背景图片 */ + margin-bottom: 25px; /* 设置底部外边距 */ } .post .title { - height: 30px; - color: #549900; + height: 30px; + color: #549900; /* 设置标题颜色为绿色 */ } .post .title a { - text-decoration: none; - color: #585D60; + text-decoration: none; /* 去除标题链接下划线 */ + color: #585D60; /* 设置标题链接颜色 */ } -.post .date { -} +.post .date { } .post .meta { - margin-top: -10px; - padding: 2px 30px 2px 16px; - background: url(/dingcan/images/img03.gif) no-repeat left 8px; - font-family: Arial, Helvetica, sans-serif; - font-weight: normal; - font-size: 10px; - color: #66665E; + margin-top: -10px; /* 设置meta部分的上外边距 */ + padding: 2px 30px 2px 16px; + background: url(/dingcan/images/img03.gif) no-repeat left 8px; /* 设置背景 */ + font-family: Arial, Helvetica, sans-serif; + font-weight: normal; + font-size: 10px; + color: #66665E; /* 设置meta字体颜色 */ } .post .meta span { - display: block; - margin-top: -10px; + display: block; /* 设置meta span为块级元素 */ + margin-top: -10px; /* 设置上外边距 */ } -.post .meta a { } - .post .entry { - padding: 10px 0; -} - -.post .links { - margin: 0 250px 0 0; - padding: 0 0 0 0px; + padding: 10px 0; /* 设置条目内容的内边距 */ } -.post .links .comments { -} - -.post .links .permalink { - padding-left: 17px; -} - -/* */ - +/* Sidebar部分样式 */ #sidebar { - float: left; - width: 177px; - padding-left: 22px; - font-family: Arial, Helvetica, sans-serif; - font-size: 11px; - color: #585D60; + float: left; /* 侧边栏浮动到左侧 */ + width: 177px; /* 设置侧边栏宽度 */ + padding-left: 22px; /* 设置左内边距 */ + font-family: Arial, Helvetica, sans-serif; /* 设置字体 */ + font-size: 11px; /* 设置字体大小 */ + color: #585D60; /* 设置字体颜色 */ } #sidebar ul { - margin: 0; - padding: 0; - list-style: none; - line-height: normal; + margin: 0; + padding: 0; + list-style: none; /* 去除默认列表样式 */ + line-height: normal; } #sidebar li { - margin-bottom: 30px; - padding: 0 0 10px 0px; -} - -#sidebar li ul { -} - -#sidebar li li { - margin: 0; - padding: 7px 10px 10px 7px; - background: url(/dingcan/images/img07.jpg) repeat-x left bottom; + margin-bottom: 30px; /* 设置列表项底部外边距 */ + padding: 0 0 10px 0px; } #sidebar p { - margin: 0; - padding: 0px 10px; + margin: 0; /* 去除段落的外边距 */ + padding: 0px 10px; /* 设置内边距 */ } #sidebar h2 { - height: 26px; - margin: 0 0 10px 0px; - padding: 12px 0 2px 7px; - text-transform: capitalize; - font-size: 18px; - font-weight: normal; - color: #464F54; + height: 26px; + margin: 0 0 10px 0px; + padding: 12px 0 2px 7px; /* 设置内边距 */ + text-transform: capitalize; /* 设置首字母大写 */ + font-size: 18px; /* 设置字体大小 */ + font-weight: normal; + color: #464F54; /* 设置字体颜色 */ } - -#sidebar p { - line-height: 200%; -} -#sidebar a { - text-align: left; - text-decoration: none; - font-weight: normal; - color: #585D60; -} - -/* */ - -#calendar { -} - -#calendar caption { - padding-bottom: 5px; - font-weight: bold; -} - -#calendar table { - width: 100%; - border-collapse: collapse; - border-bottom: 1px solid #24130F; - border-left: 1px solid #24130F; - border-right: 1px solid #24130F; -} - -#calendar thead th { - padding: 5px 0; - text-align: center; - border-top: 1px solid #24130F; - border-left: 1px solid #24130F; - background: #24130F; -} - -#calendar tbody td { - padding: 5px 0; - text-align: center; - border-top: 1px solid #24130F; - border-left: 1px solid #24130F; - border-bottom: 1px solid #24130F; -} - -#calendar tfoot td { - padding: 5px; - border-left: 1px solid #24130F; - border-bottom: 1px solid #24130F; -} - -#calendar tfoot #next { - border-top: 1px solid #24130F; - text-align: right; -} - -#calendar tfoot #prev { - border-top: 1px solid #24130F; -} - -#calendar .pad { - border-bottom: 1px solid #24130F; -} - -#calendar #today { - background: #24130F; -} - -/* Footer */ - +/* Footer 样式 */ #footer { - width: 920px; - height: 49px; - margin: 0 auto; - padding-top: 50px; + width: 920px; /* 设置页脚宽度 */ + height: 49px; /* 设置页脚高度 */ + margin: 0 auto; /* 页脚居中显示 */ + padding-top: 50px; /* 设置页脚顶部内边距 */ } #footer-bgcontent { - margin: 0px; - padding: 0px; - height: 99px; - background: #394144; + margin: 0px; + padding: 0px; + height: 99px; /* 设置页脚内容的高度 */ + background: #394144; /* 设置背景色 */ } #footer p { - margin: 0; - text-align: center; - line-height: normal; - text-transform: uppercase; - font-size: 10px; - color: #FFFFFF; + margin: 0; + text-align: center; /* 设置文本居中 */ + line-height: normal; + text-transform: uppercase; /* 设置文字大写 */ + font-size: 10px; /* 设置字体大小 */ + color: #FFFFFF; /* 设置字体颜色 */ } #footer a { - color: #E5FFC4; + color: #E5FFC4; /* 设置链接颜色 */ }