1 排版时经常遇到块级元素内容overflow，怎么妥当处理是一个关键。

overflow的常用属性：

 代码：

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>overflow</title>
    <style type="text/css">        .ada{            width: 300px;            height: 400px;            /*1 超出的可见*/            /*overflow: visible;*/            /*2 超出的段落隐藏*/            /*overflow: hidden;*/            /*3 超出的段落进行滚动*/            overflow: scroll;        }    </style></head><body>     <!--css初始化兼容问题-->        <div class="ada"><img src="img/1.jpg">            <p>lalallaal</p>            <p>lalallaal</p>            <p>lalallaal</p>            <p>lalallaal</p>            <p>lalallaal</p>               <p>lalallaal</p>            <p>lalallaal</p>            <p>lalallaal</p>            <p>lalallaal</p>            <p>lalallaal</p>        </div>

</body></html>

3 overflow：scroll
 

css总结11：css的overflow问题的更多相关文章

  1. CSS.04 -- 浮动float、overflow、定位position、CSS初始化

    标准流:行内/行内块元素横向有序排列 : 块元素纵向有序排列. 浮动:Float 语法:float:left/right :  设置浮动的元素,脱离标准流 浮动的框可以向左或向右移动,直到它的外边缘碰 ...

  2. 修改css的（屏蔽）overflow: hidden;实现浏览器能把网页全图保存成图片

    摘要: 1.项目需要,需要对网页内容“下载”保存成全图片 2.QQ浏览器等主流浏览器都支持这种下载保存功能 3.项目需要场景:编写好的项目维护文档,放在服务器上.如果是txt不能带图片可视化,如果wo ...

  3. CSS浮动与清除浮动(overflow)例子

    在css中浮动与清除浮动功能是我们开发中常用到的一个功能了,下面小编来为各位分析关于CSS浮动与清除浮动(overflow)例子吧． float脱离文本流,可是为什么文字却会有环绕的效果,这点实在是神 ...

  4. 范仁义html+css课程---11、html补充知识

    范仁义html+css课程---11.html补充知识 一.总结 一句话总结: 小于号(<):< 大于号(>):> 空格:  二.html 字符实体 1.小于号(<)和大 ...

  5. css笔记11：选择器练习

    1. (1)exam1.css文件: .s1 { font-size: 50px; color: blue; } .s2 { backgoround:gray; font-style: italic; ...

  6. Javascript图片预加载详解 分类： JavaScript HTML+CSS 2015-05-29 11:01 768人阅读 评论(0) 收藏

    预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...

  7. CSS+div总结 标签： css 2016-01-17 11:35 926人阅读 评论(31) 收藏

    根据学习计划,将视频进行了学习,之前就知道css是基础,然后一致认为既然是基础,应该比较简陋吧,结果经过学习才发现,css的效果也是很炫的啊,然后学习完了视频,自己又找了一些教程.下面就简单介绍一下我 ...

  8. 前端基础----CSS语法、CSS四种引入方式、CSS选择器、CSS属性操作

    一.CSS语法 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如: h1 {color:red; font-size:14px;} 二.CSS四种引入方式 1,行内式 行内式是在标 ...

  9. No.3 - CSS transition 和 CSS transform 配合制作动画

    课程概述 作业提交截止时间:09-01 任务目的 深度理解掌握 transition-timing-function 以及它的意义 学会配合使用 CSS transform 和CSS transiti ...

  10. CSS选择器、CSS hack及CSS执行效率

    主要内容: 1.CSS选择器.优先级与匹配原理 2. CSS 引入的方式有哪些 ? link 和 @import 的区别是 ? 3.CSS hack 4.如何书高效CSS  一.CSS选择器.优先级与 ...

随机推荐

  1. c#联网判断

    引用命名空间:sing System.Net.NetworkInformation; var address = "www.baidu.com"; Ping ping = null ...

  2. as3 htmlText 的bug

    as的文本框  会把连续的英文当作一个单词处理 如果是在已有内容的行后 超过宽度就会换行 左边的用了英文冒号直接被当成完整的单词右边的被当成了 jj5jk : mmmmmmmmmm 三个单词

  3. Weblogic配置SSl使用Https

    一 .可以开启自带的SSL连接 启动weblogic,进入左侧菜单,点击左侧的安全领域-->点击myrealm-->点击角色和策略-->点击服务器AdminServer 点击保存,w ...

  4. 使用 Git 来备份 MySQL 数据库

    使用 Git 来备份 MySQL 数据库 使用 mysqldump 导出 sql 文件 使用 git pull 提交到仓库 将脚本加入任务管理 mysqldump 导出时需要以下参数. --skip- ...

  5. js判断客户端是pc还是手机

    function IsPC() { var userAgentInfo = navigator.userAgent; var Agents = ["Android", " ...

  6. android栈和队列

    android栈和队列 栈和队列是两种特殊的线性表,它们的逻辑结构和线性表相同,只是其运算规则较线性表有更多的限制,故又称它们为运算受限的线性表.LinkedList数据结构是一种双向的链式结构,每一 ...

  7. 记一次印象有点深刻的坑（bug）

    1.该模块的主要功能介绍 该系统是一个网上课程预约系统. 学生进行口语预约(没上课前可以进行取消)--> 等待上课 --> 上完课老师进行完成的确认操作. 2.问题描述 看下图,现在出现的 ...

  8. 洛谷 P1975 [国家集训队]排队 Lebal:块内排序+树状数组

    题目描述 排排坐,吃果果,生果甜嗦嗦,大家笑呵呵.你一个,我一个,大的分给你,小的留给我,吃完果果唱支歌,大家乐和和. 红星幼儿园的小朋友们排起了长长地队伍,准备吃果果.不过因为小朋友们的身高有所区别 ...

  9. C#三层架构实例

    对于三层的概念查也查了,看也看了,下面是我找的一个关于三层的简单实例,真正看一下它是如何具体实现的. 我们先来一起看看 实体类-Model 实质:实体类就是在完成数据库与实体类对应的功能,一个类是一张 ...

  10. 进程之 Process join方法其他属性与进程Queue

    Process join方法 以及其他属性 在主进程运行过程中如果想并发地执行其他的任务,我们可以开启子进程,此时主进程的任务与子进程的任务分两种情况 情况一:在主进程的任务与子进程的任务彼此独立的情 ...