zoukankan      html  css  js  c++  java
  • 嵌入式图片下沉效果

    本文实现嵌入式图片下沉效果,先上几张效果图:

    css代码如下:

    #firstWord{
        padding:0 10px 0 374px;background: url("images/validateBtn.png") no-repeat top left white;background-size:374px 105px;
        color: red;font-size: 84px;font-weight: bold;white-space:nowrap;
        position: relative;float: left;
        min-width: 1px;min-height: 105px;
    }

    dom结构如下:

    <p id="myP">
        <div id="firstWord">标题</div>开始开始开始开始开始开始开始开始开始文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字测试文字
    </p>

     如有表述不准确之处,欢迎指正,欢迎补充,感谢阅读。

  • 相关阅读:
    精英程序员
    C语言(2)
    C语言练习
    C语言工具---Code::Blocks
    C语言(1)
    【udacity】机器学习-神经网络
    【udacity】机器学习-回归
    【udacity】机器学习-决策树
    【术语记录】机器学习
    python入门(九):目录操作
  • 原文地址:https://www.cnblogs.com/wangzhenyu666/p/8302099.html
Copyright © 2011-2022 走看看