样式属性

Posted 挽你何用

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了样式属性相关的知识,希望对你有一定的参考价值。

背景与前景:

背景:width:600px; 背景的宽

          height:600px; 背景的高

          background—color: 颜色;  背景色

          background—image:url(路径);   背景图片

          backgeound—attachment:scroll;   背景随字体滚动   scroll 滚动 fixed 固定

          background—repeat:no-rpeat;      背景图不平铺    repeat,平铺;   repeat—x,横向平铺;  repeat—y,纵向平铺;

          background—position:ceter;    背景图居中

          background—position:right top;     背景图放在右上角

          background—position:left 30px  top 30px;      离左边30像素,离上边30像素

         background—size:width 500px  height 500px;  背景色宽500像素高500像素     背景色大小先写宽度在写高度

字体;

         font—family:微软雅黑;     字体

         font—size:14px;    字体大小 14px普通正文字体大小 12px 页脚小字体  16px 大字体

         font—weight:bold;  bold字体加粗,normal是正常

         font—style:italic;    字体倾斜

         color: ;   颜色

         text—decoration:underline;   下划线    overline是上划线   line—through是删除线      none是去掉下划线

         text—align:center;  水平居中对齐 left 左对齐  right 右对齐

        vertical—align:middle;   垂直对齐    top 顶部对齐 botton 底部对齐

        line—height:24px;  行高   与垂直对齐同时存在

        text—indent:28px;  首行缩进量

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
#text{
width:600px;
height:600px;
background-color:#F0F;
background-image:url(01.jpg.200.150.jpg);
background-attachment:scroll; /*背景随字体滚动*/
background-repeat:no-repeat; /*背景图片不平铺*/
background-position:center; /*背景图居中*/    
background—size:width 500px hight 500px;
font-family:微软雅黑;
font—size:30px;
font—weight:bold; /*字体加粗*/
font-style:italic; /*字体倾斜*/
color:#F00;
text-decoration:line-through; /*删除下划线*/
text-align:center; /*水平对齐*/
vertical-align:middle; /*垂直居中对齐*/
line—height:600px; /*与垂直居中对齐同时存在*/
}
</style>
</head>

<body>
<div id="text">测试文字</div>
<div type="text—indent:28px">柔和的阳光斜挂在苍松翠柏不凋的枝叶,显得那么安静肃穆,绿色的草坪和白色的水泥道貌岸然上,脚步是那么轻起轻落,大家的心中却是那么的激动与思绪波涌。如果你现在就已经觉得自己是一个毫无希望的失恋者,那我也没什么办法,只能向你免费提供一个古老的偏方——时间,加上别的女人。 </div>

</body>
</html>

 

以上是关于样式属性的主要内容,如果未能解决你的问题,请参考以下文章

网页换肤效果 系统界面切换皮肤样式

src,href 和rel的区别

CSS代码片段

CSS代码片段

在Tomcat的安装目录下conf目录下的server.xml文件中增加一个xml代码片段,该代码片段中每个属性的含义与用途

javascript 即兼容性升级页面样式片段