zoukankan      html  css  js  c++  java
  • 文字排版效果

    text-show:2px 2px 5px gray;   文字阴影显示

    letter-spacing:1px;  文字间距1px;

    padding:10px;    内边距10px;

    -webkit-columns:atuo 3;     文字分为三排

    -webkit-column-gap:30px;   间空隙30px;

    -webkit-column-rule:1px dashed gray;     排间加虚线

    border-radius:10px;   边框添加圆弧为css3新技术

    80%  可以占屏幕的百分之八十

    margin:0 atuo;   居中

    background-image:-webkit-linear-gradient(#eee,#fff);   背景为渐变色

    background-repeat:no repeat; 背景不平铺

    如下为文字排版案例

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>无标题文档</title>
    <style>
    body {
        text-align: center;
        background-image: -webkit-linear-gradient(#eee, #fff);
        background-repeat: no-repeat;
    }
    .myc {
        border: 1px solid #B8B8B8;
        letter-spacing: 1px;
        line-height: 30px;
        padding: 10px;
        -webkit-columns: auto 3;
        -webkit-column-rule: 1px dashed gray;
        -webkit-column-gap: 30px;
        text-indent: 26px;
        font-size: 12px;
        border-radius: 15px;
        width: 80%;
        margin: 0 auto;
    }
    .myt {
        letter-spacing: 50px;
        font-size: 35px;
        text-shadow: 2px 2px 5px gray;
    }
    </style>
    </head>
    
    <body>
    <h1 class="myt">公司简介</h1>
    <p class="myc"> 否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿
      斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬
      阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂否阿斯蒂芬阿斯蒂芬阿斯蒂芬阿斯蒂芬发送到发斯蒂芬。 </p>
    </body>
    </html>
  • 相关阅读:
    【阿里云产品评测】装甲兵在云路上!
    区间交集问题
    信封嵌套问题
    twoSum问题的核心思想
    队列实现栈|栈实现队列
    设计Twitter 时间线
    如何使用单调栈解题
    二叉堆详解实现优先级队列
    git/SQL/正则表达式的在线练习网站
    我的 Redis 被入侵了
  • 原文地址:https://www.cnblogs.com/lsr111/p/4398655.html
Copyright © 2011-2022 走看看