zoukankan      html  css  js  c++  java
  • CSS实现三角形

    代码
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="http://www.n1pay.com/templets/zhifu/style/reset.css" type="text/css" />
    <title>无标题文档</title>
    <style>
    body
    {
        background
    :url(http://bbs.blueidea.com/attachment.php?aid=157417&k=6d63e29bcfc152ef20fee8078c57a828&t=1293673644&noupdate=yes);
    }
    #wrap 
    {
        width
    :920px;
        margin
    :0 auto;
        padding
    :20px;
    }
    .box
    {
        background
    :#FFFFFF;
        padding-top
    :20px;
    }
    .box h2
    {
        position
    :relative;
        right
    :-16px;
        height
    :48px;
        background
    :#DD4C2D;
    }
    .sanjiao
    {
        background
    :#fff;
        height
    :16px;
        position
    :relative;
    }
    .bor
    {
        border-top
    :8px solid #A23919;
        border-left
    :8px solid #A23919;
        border-right
    :8px dashed transparent;
        border-bottom
    :8px dashed transparent;
        width
    :0px;
        height
    :0px;
        font-size
    :0px;
        overflow
    :hidden;
        position
    :absolute;
        right
    :-16px;
        top
    :-2px;
    }
    </style>
    </head>
    <body>
        
    <div id="wrap">
            
    <div class="box">
                
    <h2></h2>
                
    <div class="sanjiao"><div class="bor"></div></div>
                
    <div style="padding:0px 20px;">其他的文字,其他的文字。其他的文字,其他的文字。其他的文字,其他的文字。其他的文字,其他的文字。其他的文字,其他的文字。其他的文字,其他的文字。其他的文字,其他的文字。其他的文字,其他的文字。其他的文字,其他的文字。其他的文字,其他的文字。其他的文字,其他的文字。其他的文字,其他的文字。</div>
            
    </div>
        
    </div>
    </body>
    </html>
    不用图片实现的效果
  • 相关阅读:
    世界史上最著名的十大思想实验
    excel 鼠标上下左右移动
    excel 批注
    C# TextWriter类
    C#中的Hashtable
    cython安装、使用
    Java JsonPath grab InvalidPathException in code, you must be catching Java 7's java.nio.file.InvalidPathException instead of JsonPath's com.jayway.jsonpath.InvalidPathExceptio
    Java牛角尖【007】:Java中的Error能不能被Catch
    2016亚洲城市GDP50强出炉
    全国5A级旅游景区已达250家
  • 原文地址:https://www.cnblogs.com/strawer/p/1922265.html
Copyright © 2011-2022 走看看