<style>
        body{background:#FCC;}
        .c00 div{ margin:0 auto; padding:0;}
        #a01{ width:500px; height:400px; background:#00F; padding-top:100px;}
        #a02{ width:300px; height:200px; background:#903; padding-top:100px;}
        #a03{ width:100px; height:100px; background:#0FF; color:#000; font-family:华文彩云;
              font-size:24px; line-height:34px;}
        div marquee{ width:100px; height:100px;}
        .c01{ width:200px; height:200px; background:#9FF; position:fixed; top:30px; left:30px;
               font-family:华文彩云; font-size:36px; font-weight:bold; font-style:italic; color:#0CF; text-align:center;
              vertical-align:top 20px; line-height:200px; text-decoration:underline; text-indent:20px;}
              <!--字体样式              字体大小       字体加粗               字体倾斜          字体颜色       字体水平居中(或靠右)-->
              <!-- 字体垂直方向距离顶部20px 要配合line-height（行高）使用          下划线        首行缩进20像素   -->          
    </style>
    
    <body>
        <div class="c00">
            <div id="a01">
                <div id="a02">
                    <div id="a03">
                        <marquee direction="down">
                            这就是div居中嵌套
                        </marquee>
                    </div>
                </div>
            </div>
        </div>
       <!-- 使用margin进行上下位移时需要给边框
               padding位移时需要自身减去相应的位移像素距离
            (因为padding内边距会给自身加上位移的像素距离
             也可以设为负值使用)    
       -->
       
           <div class="c01">
               <!--
            背景样式属性
            
            background-color:#222; 背景颜色     
                          -image: ;  背景图片
                          -attachment:fixed; 背景固定不随字体动
                                     :scroll; 背景随字体走动
                          -repeat:  选项决定是否平铺，x轴平铺 y轴平铺等；
                          -position: 定位  用选项固定图片位置
            
            字体样式属性
            font-family；    字体样式
            font-size；        字体大小    
                -indent；    首行缩进多少像素
                -weight:bold;   加粗
                -style:italic;  倾斜
                color:#0CF;  字体颜色
            
            text-align:center;  字体水平方向居中（或其他方向）
            vertical-align:top 20px;  字体垂直方向 距离顶部 20像素（必须配合行高属性使用）
            line-height:200px;  行高
            text-decoration:underline; 下划线
                           :line-through;  删除线
                           :overline;  上划线
                           
            边界，边框
            margih:   ;     外边距
            padding:    ;    内边距
            border：1px solid #222;     边框  1像素 实线 颜色为黑色；
            
            （margih：10px 10px 10px 10px ;  外边距  上右下左  分别为10 10 10 10    顺序是按照顺时针来的；）
            --->
                
                    实验字体        
           </div>

    </body>

style里的文字 背景 样式以及边框的更多相关文章

  1. 黄聪：phpexcel中文教程-设置表格字体颜色背景样式、数据格式、对齐方式、添加图片、批注、文字块、合并拆分单元格、单元格密码保护

    首先到phpexcel官网上下载最新的phpexcel类,下周解压缩一个classes文件夹,里面包含了PHPExcel.php和PHPExcel的文件夹,这个类文件和文件夹是我们需要的,把class ...

  2. phpexcel中文教程-设置表格字体颜色背景样式、数据格式、对齐方式、添加图片、批注、文字块、合并拆分单元格、单元格密码保护

    转:http://www.cnblogs.com/huangcong/p/3687665.html 首先到phpexcel官网上下载最新的phpexcel类,下周解压缩一个classes文件夹,里面包 ...

  3. PHPExcel-设置表格字体颜色背景样式、数据格式、对齐方式、添加图片、批注、文字块、合并拆分单元格、单元格密码保护

    首先到phpexcel官网上下载最新的phpexcel类,下周解压缩一个classes文件夹,里面包含了PHPExcel.php和PHPExcel的文件夹,这个类文件和文件夹是我们需要的,把class ...

  4. css3实现背景颜色渐变，文字颜色渐变，边框颜色渐变

    css3的渐变可以使用2个或者多个指定的颜色之间显示平稳的过渡的效果.这篇文章主要介绍下css3实现背景颜色渐变,文字颜色渐变,边框颜色渐变的方法,以便大家学习参考! 1.css背景颜色渐变 代码: ...

  5. CSS设置边框、符号、背景样式、链接属性

    一.CSS边框空白 padding-top:10px; /*上边框留空白*/ padding-right:10px; /*右边框留空白*/ padding-bottom:10px; /*下边框留空白* ...

  6. CSS（Cascading Style Sheet，叠层样式表），作用是美化HTML网页。

    CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/    此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控 ...

  7. Chrome 控制台新玩法-console显示图片以及为文字加样式

    有兴趣的同学可以文章最后的代码复制贴到控制台玩玩. Go for Code 在正常模式下,一般只能向console 控制台输出简单的文字信息.但为了把信息输出得更优雅更便于阅读,除了cosole.lo ...

  8. HTML 学习笔记 CSS样式（边框）

    元素的边框(border)是围绕元素内容和内边距的一条或多条线 CSS border 属性允许你规定边框的样式 宽度和颜色 CSS 边框 在 HTML 中,我们使用表格来创建文本周围的边框,但是通过使 ...

  9. CSS常用字体属性(多出的文本隐藏，或者以省略号的形式显示)和背景样式以及背景图的2个不常用属性：background-origin和background-clip

    (一)常用的字体属性: font-weight: 属性值100-900  400等于正常 700等于bold ,数值越大,越粗 font-size:字体大小,单位可以为px或者% font-famil ...

随机推荐

  1. 团队作业1——团队展示&博客作业查重系统

    团队展示: 1.队名:六个核桃 2.队员学号: 王婧(201421123065).柯怡芳(201421123067组长).陈艺菡(201421123068). 钱惠(201421123071).尼玛( ...

  2. 团队作业8----第二次项目冲刺（Beta阶段） 第一天

    BETA阶段冲刺第一天 1.开了个小会议 2.每个人的工作 (1) 昨天已完成的工作: 今天是第一天,所以是新的开始. (2) 今天计划完成的工作: (3) 工作中遇到的困难: 由于有新的成员加入,默 ...

  3. 集美大学网络1413第十二次作业成绩（个人作业3） -- Alpha阶段个人总结

    题目 个人作业3--个人总结(Alpha阶段) 优秀作业链接:**068 未交:**087 个人作业3成绩 学号 姓名 总结(4) 5个问题(2.5) 自我评价(2.5) 博客互动 (1) 总分(10 ...

  4. 团队作业4——第一次项目冲刺（Alpha版本） 1

    一.Daily Scrum Meeting照片 二.燃尽图 三.项目进展 1.完页面的设计 采用gui页面,现在也是最初的页面设计 2.完成接口的定义 与组员共同定义了接口 四.困难与问题 此次主要利 ...

  5. 201521123107 《Java程序设计》第2周学习总结

    第2周作业-Java基本语法与类库 1.本周学习总结 要点主要有: (1)String类 String类是本周的一个重点,String类的对象是不可变的,即String对象后就在内存中开辟了一个字符串 ...

  6. 第二次项目冲刺（Beta阶段）--第四天

    一.站立式会议照片 二.项目燃尽图 三.项目进展 队员  ID 贡献比 王若凡 201421123022 20% 吕志哲 201421123021 16% 欧阳勇 201421123026 16% 卢 ...

  7. 201521123017 《Java程序设计》第7周学习总结

    1. 本周学习总结 2. 书面作业 Q1.ArrayList代码分析 1.1 解释ArrayList的contains源代码 1.2 解释E remove(int index)源代码 1.3 结合1. ...

  8. 201521123117 《Java程序设计》第4周学习总结

    1. 本周学习总结 Q1.1 尝试使用思维导图总结有关继承的知识点. Q1.2 使用常规方法总结其他上课内容. 答:控制可见性的4个访问修饰符private -- 仅对本类可见public -- 对所 ...

  9. 201521123104 《Java程序设计》 第12周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 2. 书面作业 将Student对象(属性:int id, String name,int age,doubl ...

  10. Linux系统文件与目录权限管理

    Linux文件目录权限管理 一.Linux文件属性及权限 1.Linux文件及目录权限及属性说明 (1)权限及属性说明 (2)文件权限说明 三种权限说明:r 读  read w 写  write  x ...