平时我们制作网页都会用到规范字体和图片的css代码,下面在我的大学网站里为大家简单介绍一下规范非字体和图片的简单的代码,css的基础代码。对应不是计算机技术出生的站长们,想做简单的单页或网站有一定的帮助!

【图片】/*图片执行以下命令<div class="jkzt_1 main">


<div class="jkzt_2">

<div class="jkztNr"> <a href="http://www.college-ing.com/"> <img src="imagas/zt1.jpg" /></a></div></div></div>*/


.jkzt_1{ width:1000px; overflow:hidden; margin-left:5px; margin-top:10px; margin:0 auto;}

.jkzt_2{ width:1000px; overflow:hidden; margin-left:5px}

.jkzt_1 .jkztNr{ float:left; width:305px; height:148px; background:#e8e7e7; padding:10px; float:left; margin-right:7px; margin-bottom:60px;}

.jkzt_1 .jkztNr a img{ border:1px solid #fff;}

.jkzt_1 .jkztNr a:hover img{ border:1px solid #f00;}

规范字体和图片的简单css代码基础CSS代码

 

【字体】/* html <div class="ziti"><a href="http://www.college-ing.com/">我的大学</a></div> 中间的“我的大学”字体执行以下命令*/  

 

.jkzt_1 .ziti a {

font-size:16px;             /* 字体大小 16px */

line-height:50px;         /* 字体行间距 50px */

font-weight:bold;          /* 字体加粗 bold */

padding-left:45px;        /* 字体左边空出 45px */

color:#FF3333;              /* 字体颜色 #FF3333 */

letter-spacing:2px;        /* 字体间距 2px */

text-decoration:None;   /* 定义文字的“装饰”样式 没有、下火线、上划线 None|underline|overline|line-through|blink */

Vertical-align                 /* 定义了元素在垂直方向上的位置 Baseline|sub|super|top|text-top|middle|bottom|text-bottom */

}

 

text-transform 使文本转换为其它形式 Capitalize|uppercase|lowercase|none

Text-align 定义了文字的对齐方式 Left|right|center|justify

Text-indent 定义了文本的首行的缩进方式<length>|<percentage>

Line-height 定义了文本的行高 Normal|<unmber>|<length>| 

Letter-spacing 定义了每个字母之间的间距 同上

Vertical-align 定义了元素在垂直方向上的位置 Baseline|sub|super|top|text-top|middle|bottom|text-bottom