【CSS】网页CSS简单代码 字体图片基础css代码
平时我们制作网页都会用到规范字体和图片的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;}
【字体】/* 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 定义了文本的首行的缩进方式
Line-height 定义了文本的行高 Normal|<unmber>|<length>|
Letter-spacing 定义了每个字母之间的间距 同上
Vertical-align 定义了元素在垂直方向上的位置 Baseline|sub|super|top|text-top|middle|bottom|text-bottom
声明:本网站为“个人非营利性”网站,仅是博主与热心网友收集整理提供的经验记录和学习内容!本站文章图片来源于网络,如若本站图片侵犯了原著者的合法权益,可联系本站删除。
网站初心:一些棘手的、偏门的问题,能比较方便地在一个网站上查询、解决。如能帮到你的,可以在文章结尾赞赏一下,维持网站日常维护!谢谢