css代码翻译

2023-02-21 08:13:01html-css08

css代码翻译,第1张

重复的就没有写了

body{/*body标签*/

background-color:white/*背景色white（白色，等同于 #fff）*/

font-size:12px/*字体大小*/

font-family:Arial, Helvetica, sans-serif/*字体*/

margin:0px/*外边距*/

padding:0px/*内边距*/

color:white/*标签文字色*/

}

ul,li{

margin:0px/*外边距*/

padding:0px/*内边距*/

}

li{

display:inline/*元素会被显示为内联元素，元素前后没有换行符*/

list-style:none/*列表无样式*/

list-style-position:outside

text-align:center/*内部居中处理*/

font-weight:bold/*粗体*/

float:left/*元素左浮动*/

}

a:link{/*link 链接通用*/

color:#336601/*元素颜色*/

text-decoration:none/*无下划线*/

float:left

width:100px/*宽度*/

padding:3px 5px 0px 5px/*内边距 padding:上右下左，margin是一样的*/

}

a:visited{/*访问过的链接*/

color:#336601

text-decoration:none

float:left

padding:3px 5px 0px 5px

width:100px

}

a:hover{/*鼠标划过链接，类似于一个mousemove事件*/

color:white

float:left

padding:3px 3px 0px 20px

width:88px

text-decoration:none

background-color:#539D26/*背景色*/

}

a:active{/*活动中的链接鼠标左键点击事件（左键未弹起） */

color:white

float:left

padding:3px 3px 0px 20px

width:88px

text-decoration:none

background-color:#BD06B4

}

#nav{/*标签id为nav*/

width:700px

height:30px

border-bottom:0px/*下边框*/

padding:0px 5px/*另外一种那个写法只有两个属性值时->padding:上下左右*/

position:absolute/*绝对位置*/

z-index:1/*z序*/

left: 198px/*左定位*/

top: 25px/*右定位*/

}

.list{/*类class=list*/

line-height:20px/*行高*/

text-align:left

padding:4px

font-weight:normal

}

.menu1{

width:120px

height:auto

margin:6px 4px 0px 0px

border:1px solid #9CDD75/*边框border:粗细样式颜色*/

background-color:#09C

color:#336601

padding:6px 0px 0px 0px

cursor:hand/*鼠标样式hand*/

overflow-y:hidden/*元素超过高度时hidden（隐藏）*/

/*下面2行的是滤镜透明度*/

filter:Alpha(opacity=70)

-moz-opacity:0.7

}

.menu2{

width:120px

height:18px

margin:6px 4px 0px 0px

background-color:#F5F5F5

color:#999999

border:1px solid #EEE8DD

padding:6px 0px 0px 0px

overflow-y:hidden

cursor:hand

}

我把选择器的含义、属性的含义都写了一遍，下面重复的我就没写了。如果你希望了解的更详细，可以把每一个属性用百度去搜。

body //下面的样式，作用于<body>标签

{margin:0//上、下、左、右外边距都为0；

padding:0//上、下、左、右内边距都为0；

background:#ccc//背景色为#ccc

}

header h3//下面的样式，作用于<header>标签里面的<h3>标签

{margin:0

padding:0

text-align:center//文本居中

line-height:80px//行高80px

color:#fff//字体颜色#fff

font-size:25px//字体大小25px

}

header ul//下面的样式，作用于<header>标签里面的<ul>标签

{ list-style:none//列表前面没圆点

overflow:hidden//超过范围的都隐藏

padding-left:270px//左边距270px

padding-top:160px

}

header ul li a//下面的样式，作用于<header>标签里面的<ul>里面的<li>里面的<a>标签

{color:#004a87

float:left//向左浮动

padding-left:30px

font-size:12px

text-decoration:none//无下划线

}

ul li a:hover//下面的样式，作用于鼠标在链接上面的时候的样式

{color:#FF0080}

#zuida

{margin:auto

width:880px

margin-bottom:5px

border:1px dashed #cdcdcd

background:#fff

}

header

{background:url(../images/bannar.jpg) no-repeat

height:300px

margin-bottom:5px

}

#content//下面的样式，作用于id="content"的标签

{

margin-bottom:5px

}

#zuoce

{

height:600px

width:640px

float:right

}

#youce

{ border:1px solid #abcdef//边框为1px大小的实线，颜色为#abcdef

box-shadow:1px 1px 3px RGBA(0,0,0,.5)//边框阴影效果，上右都是1px宽，下是3px宽，左的颜色是RGBA(0,0,0,.5)

width:235px

}

footer

{ height:30px

background:#88dddd

clear:both//清楚两边的浮动，即是两边的浮动都清空

}

img

{margin:0px 2px/*设置上下有两个像素的外边距*/

}

#youce h5

{margin:0

padding:0px

background:url(../images/leftbg.jpg) no-repeatheight:23

text-align:center

line-height:23px

border-bottom:2px dotted #0099ff

}

#youce p

{padding-left:10px

margin:0px

padding-top:8px

font-size:12px

line-height:1.5

}

#youce div ul li

{list-style:none

}

#youce div ul li a

{text-decoration:none

color:#234187

font-size:12px

}

#youce div ul li:before//能实现跟js相似的效果，鼠标放上去之前的显示效果

{

content:url(../images/4.gif)//鼠标放上去之前，内容是这张图片

margin-right:3px//鼠标放上去之前，右边距是3px

}

#youce div ul{ padding:7px

margin:7px

}

#youce div ul li a:hover{color:#f00

}

#zuoce div h3{

color:#0f0

border-bottom:1px dotted #999

margin:0

padding:0

}

#zuoce div{

border:1px solid #ccc

}

.zuozhe{

color:#888

margin:0

padding:0

font-size:12px

text-align:right

}

.zhenwen,.zhengwen,.dian,.pinglun{

font-size:12px

text-indent:2em；//段落缩进2em

line-height:1.5

}

.pinglun{

color:#ff6600

}

footer{

color:#004587

text-align:center

line-height:30px

}

body {/*设置body整体样式*/

background-color: #DCDCDC /*背景色*/

font-family: Arial, Helvetica, sans-serif/*字体*/

font-size: 12px/*字体大小*/

line-height: 24px/*文字行高*/

color: #336699/*字体颜色*/

}

td, th { /*设置所有表格中td th样式以下属性同body一样解释*/

font-family: Arial, Helvetica, sans-serif

font-size: 12px

line-height: 24px

color: #333333

}

a { /*设置链接样式*/

color: #3366CC

text-decoration: none /*无下划线*/

}

form { /*表单样式*/

background-color: #CCCC99

}

.title { /*设置类名为title的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 24px

line-height: 30px

background-color: #006666

color: #DCDCDC

}

.subtitle {/*设置类名为subtitle的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 16px

line-height: 22px

font-weight: bold/*字体粗细*/

color: #006666

}

.header {/*设置类名为header的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 24px

background-color: #006666

color: #DCDCDC

}

.nav { /*设置类名为nav的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 14px

font-weight: bold

background-color: #CCCCCC

}

.navLink { /*设置类名为navLink的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 14px

font-weight: bold

background-color: #DEDECA

}

.sidebar { /*设置类名为sidebar的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 12px

line-height: 18px

padding: 3px /*内补白为3像素*/

background-color: #FFFFFF

}

.sidebarHeader { /*设置类名为sidebarHeader的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 16px

line-height: 24px

color: #FFFFFF

background-color: #339999

}

.sidebarFooter { /*设置类名为sidebarFooter的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 12px

line-height: 18px

background-color: #CCCCCC

}

.footer { /*设置类名为footer的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 14px

font-weight: bold

line-height: 22px

color: #333333

background-color: #CCCCCC

}

.legal { /*设置类名为legal的元素样式 */

font-family: Arial, Helvetica, sans-serif

font-size: 9px

color: #333333

}

.box1 { /*设置类名为box1的元素边框样式 */

border-color: #CCCCCC #333333 #333333 #CCCCCC /*边框的上右下左依次对应的颜色*/

border-width: medium/*边框粗细*/

border-style: ridge/*边框风格*/

}

.promo { /*设置类名为promo的元素样式 */

font-family: "Times New Roman", Times, serif

color: #000033

}

.titlebar { /*设置类名为titlebar的元素样式 */

font-family: "Times New Roman", Times, serif

font-size: 9px

color: #FFFFFF

background-color: #336699

}

.dingbat { /*设置类名为dingbat的元素样式 */

font-family: Arial, Helvetica, sans-serif

background-color: #99CC99

color: #006666

font-weight: bolder

font-size: medium

}

a:hover { /*设置当鼠标移上时候的链接样式 */

text-decoration: underline

}

input.big { /*设置input元素中类名为big的样式 */

width: 100px /*宽*/

}

input.small { /*设置input元素中类名为small的样式 */

width: 50px

}

词库加载错误未能找到文件“E高铁采集器内存溢出ConfigurationDictStopwordstxt”

# 上一篇：电脑充不进去电是怎么回事

# 下一篇：电脑锁屏密码怎么设置

推荐阅读

热门文章

最新发布

标签列表

css代码翻译

给您推荐相同类型的内容：