CSS之布局（盒子的垂直布局）

盒子的垂直布局：

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>盒子的垂直布局</title><style>.outer{background-color: #BBFFAA;/*默认情况下父元素的高度会被内容撑开*/}.inner{width: 100px;height:200px;background-color: yellow;margin-bottom: 100px;}.box1{width: 200px;height: 200px;background-color: #BBFFAA;/*子元素是在父元素的内容区中排列的，如果子元素的大小超过了父元素，则子元素会从父元素中溢出使用 overflow属性来设置父元素如何处置溢出的子元素可选值：visible， 默认值， 子元素会从父元素中溢出hidden 隐藏，溢出的内容会将内容裁剪，不会显示（一剪梅）scroll 滚动，生成两个滚动条， 来通过滚动条来查看完整的内容auto 根据需要生成滚动条overflow-x:;overflow-y:;*/overflow: auto;}.box2{width: 100px;height: 300px;background-color: yellowgreen;}</style></head><body><div class="outer"><div class="inner"></div><div class="inner"></div></div><br /><br /><div class="box1"><div class="box2"></div></div></body>
</html>

CSS之布局（盒子的垂直布局）相关推荐

css元素的水平与垂直布局
水平布局一个元素在其父元素水平方向上的位置由margin-left,border-left,padding-left,content(width),padding-right,border-righ ...
CSS选择器、盒子模型及布局
一.CSS的简介 Cascading Style Sheets:层叠样式表可以解决html代码对样式定义的重复,提高了后期样式代码的可维护性,并增强了网页的显示效果功能. 将网页内容和显示样式进行了 ...
html字体竖排上下间距,css文字竖排显示文字垂直布局
div css文字竖排 CSS文字竖立显示.CSS文字从上到下垂直显示.CSS文字垂直排版布局篇在CSS中CSS样式属性writing-mode:tb-rl是设置文字垂直显示竖排的,但是不兼容浏览器 ...
CSS——盒子模型以及盒子的水平、垂直布局
文章目录前言一.什么是文档流二.盒子模型三.盒子的水平布局四.盒子的垂直布局五.盒子的垂直外边距重叠总结前言本文主要介绍CSS中的盒子模型,以及盒子的水平与垂直布局等相关知识点,感兴 ...
MFC添加加瓦系列一之MFC水平与垂直布局
前言 MFC 作为Windows界面编程元老级的成员,确实是让人又爱又恨.但是如果有人让我在windows下实现功能性桌软,我依然会选择它.于是小马哥决定从今天起推出我的第一个编程系列<MFC填 ...
Qt水平布局，垂直布局和嵌套布局 layout
布局是一个软件质量重要的一方面,体现了软件设计的水平,一个好的软件必然有个好的布局. Qt中有水平布局:QHBoxLayout 垂直布局:QVBoxLayout 现在我们有这样一个需求,我们希望有三个 ...
QT垂直布局被平分如何解决
窗口全局布局是一个垂直布局(vAllLayout),上半部分是水平布局(hTopLayout),下半部分是垂直布局(vShowWidgetLayout).水平布局里含有多个QPushbottom,QL ...
CSS水平、垂直布局、盒子
Normal folw 文档流 <!DOCTYPE html> <html lang="en"> <head><meta charset= ...
CSS入门篇08.垂直布局与盒子大小
垂直布局: 默认情况下,块元素宽高是被内容撑开的,如果自定义,那就听你设置的宽高如果父元素宽高设置,小于内容区,则内容就会溢出 overflow属性设置可选值: visible 默认值内容正 ...

CSS之布局（盒子的垂直布局）

盒子的垂直布局：

CSS之布局（盒子的垂直布局）相关推荐

最新文章

热门文章