`
xitong
  • 浏览: 6400655 次
文章分类
社区版块
存档分类
最新评论

用DIV套DIV实现水平居中布局和背景图片平铺!(示例)

 
阅读更多
        
       #login
       {
          width:100%;
          height:345px;
          background-color:#e2e8c4;
       	}   
          
       #login div
       {
          /* background-color:Green; */
          height:345px; 
          width:1280px; 
          margin:0 auto; /*水平居中*/  
          padding-top:0px;
          background-image:url(images/login/1_08.gif);background-repeat: no-repeat;background-position: right bottom;
          
       	}           



    <div id="login">

        <div>   </div>
    </div>


分享到:
评论

相关推荐

    div css background背景

    你可以设定图片是否平铺、居中或者随内容拉伸,使用`background-repeat`、`background-position`和`background-size`属性。 3. **背景重复**:`background-repeat`控制图片是否重复显示。可选值有`repeat`(默认,...

    制作网页背景图片平铺

    上面的代码表示在屏幕宽度小于或等于768px时,使用不同的背景图片,并使其居中显示,不进行平铺。 除了CSS,JavaScript也可以用来动态改变背景图片。例如,你可以根据用户的交互或者页面状态来切换背景图片: ```...

    CSS实现纯图片替换效果和div模拟下拉条的实现 -- 剔除知识误区

    本文将深入探讨如何使用CSS实现纯图片替换效果以及如何利用div模拟下拉条,帮助开发者们避免常见的误区。 首先,我们来讨论CSS纯图片替换效果。这种技术常用于实现诸如“无文本”的按钮、自定义字体图标等场景。其...

    一列固定宽度布局和背景图片绝对定位

    在网页设计中,布局和背景图片的处理是至关重要的元素,它们直接影响到网站的视觉效果和用户体验。"一列固定宽度布局和背景图片绝对定位"是网页制作中的常见技巧,通常用于创建结构清晰、视觉吸引力强的网页。下面将...

    div常用技巧

    对于`div`元素的背景设置,通常会涉及到颜色和图片的叠加。一个典型的示例是使用CSS来定义背景颜色和背景图片,并指定其显示方式(例如平铺、重复等)。 ```css div.comment { background: #f0f0f0 url('url_...

    导航经典推荐的23种div+css代码

    5. **水平居中导航**:使导航条元素在容器内水平居中,常见方法包括使用`text-align: center`、`display: flex`和`justify-content: center`等。 6. **透明导航**:导航栏背景透明,与页面背景融合。通过调整`...

    CSS实现一张图片的效果

    更进一步,我们可以通过CSS的背景属性来实现图片的平铺、裁剪等效果,例如创建一个背景图像: ```css div { background-image: url('image.jpg'); background-repeat: no-repeat; background-position: center; ...

    实现网页背景图片拉伸的两种方法

    以下是使用jQuery实现动态背景图片拉伸的示例代码: ```javascript $(function(){ $("body").append("&lt;div id='main_bg' style='position:absolute;'&gt;&lt;/div&gt;"); $("#main_bg").append(...

    html+css背景自定义

    HTML负责结构化地呈现页面内容,如标题、段落、图片等,而CSS则专注于定义这些内容的视觉表现,如颜色、布局和背景样式。在这个"html+css背景自定义"的主题中,我们将深入探讨如何使用CSS来实现背景的个性化设置。 ...

    仿AOL随机更换网页背景图片特效代码

    标题 "仿AOL随机更换网页背景图片特效代码" 指的是一个网页设计技术,它模仿了美国在线(AOL)早期的一种功能,即在用户每次刷新页面时自动更换背景图片,为用户提供一种动态和有趣的浏览体验。这种特效在早期互联网...

    CSS3知识点归纳

    以上内容是对CSS3知识点的一个全面梳理,涉及了文字样式、文本装饰、选择器、背景、边框、盒子模型、网页布局、过渡与动画等多个方面,旨在帮助读者更好地理解和掌握CSS3的核心概念和技术要点。

    aback:全屏背景图片和视频

    1. **自定义定位**:Aback.js 提供了灵活的定位选项,开发者可以通过设置参数来决定背景图片或视频的位置,比如居中、填充、平铺等,这使得背景元素可以根据页面内容进行动态布局。 2. **封面或包含**:对于视频...

    解构了Bootstrap 4 Nav(布局)

    Bootstrap 4使用Flexbox布局模型,这使得在不同设备上实现水平居中和对齐变得简单。`justify-content-between`或`justify-content-center`等类可以轻松调整导航元素的间距。同时,`nav-item`和`nav-link`类为链接...

Global site tag (gtag.js) - Google Analytics