自我评价:走在路上的菜鸟,想着CMS|WEB|SEO,做着可以成为牛掰程序seoer的梦!

当前位置:博客 > 前端开发 > HTML|CSS代码 >

网页布局设计|三列布局-左右绝对定位-中间适应

基本思路: 左右2列采用绝对定位来布局 中间内容部分采用margin挤压出来 HTML结构 div class="container"div class="left"左侧/divdiv class="right"右侧/divdiv class="main"主体/div/div CSS样式 ...

2021-07-21 10:20:20
网页布局设计|三列布局-左右绝对定位-中间适应

css网页布局|三列布局-左右固定-中间自适应

基本思路: 和2列布局很相似 左右2列采用浮动+宽度 中间区域实际是用margin挤压出来的 DOM顺序不能写乱,必须先写左右再写中间 HTML结构 div class="left"左侧/divdiv class="right...

2021-07-21 10:18:07
css网页布局|三列布局-左右固定-中间自适应

html网页布局|两列布局-左右二侧-绝对定位

基本思路: 给2列添加一个定位的父集区块,并设置定位属性,一般设置为相对定位 给左右2个区块分别使用绝对定位 父集区块/定位父集必须设置宽度width HTML结构 div clas...

2021-07-21 10:15:57
html网页布局|两列布局-左右二侧-绝对定位

网页框架布局|二列布局-左右固定-自己撑开父级块

基本思路: 要给左右2列添加一个父集区块 要给左右2个区块设置一个浮动:left/right 给父区块添加一个after伪类让子块撑开父集 HTML结构 div class="container clear"div class="left"左侧...

2021-07-21 10:14:07
网页框架布局|二列布局-左右固定-自己撑开父级块

网页页面布局|两列布局-右侧固定-左侧自适应

基本思路: 左侧固定,并设置为左浮动 右侧主体部分设置一个左边距,它的宽度只要大于等于左侧的宽度就可以 HTML结构 div class="right"右侧/divdiv class="main"主体/div CSS样式 st...

2021-07-21 10:12:48
网页页面布局|两列布局-右侧固定-左侧自适应

网页排版布局|两列布局-左侧固定-右侧自适应

基本思路: 右侧固定,并设置为右浮动 左侧主体部分设置一个右边距,它的宽度只要大于等于左侧的宽度就可以 HTML结构 div class="left"左侧/divdiv class="main"主体/div CSS样式 sty...

2021-07-21 10:10:54
网页排版布局|两列布局-左侧固定-右侧自适应

网页div布局|单列布局-宽度自适应-内容居中

基本思路: 头部,尾部单独放在一个独立的容器中,仅设置高度即可 头部,底部的内容区仍然和主体等宽 主体仍放在一个单独的容器中,并设置水平居中 CSS样式不用修改,只需...

2021-07-21 10:07:20
网页div布局|单列布局-宽度自适应-内容居中

网页响应式布局|单列布局-上中下等宽

基本思路: 页面的头部,主体,底部全部放在一个容器中统一设置 容器中的子块只需要设置一下高度即可 HTML结构 div class="container"div class="header"头部/divdiv class="main"主体/d...

2021-07-21 10:02:24
网页响应式布局|单列布局-上中下等宽

代码技巧之常用快捷键的整理

常用快捷键的整理 ctr1+C复制 ctr1+V粘贴 ctrl+Z撤销 回到上一步操作 ctr1+D复制整行 ctr1+Z剪切整行 增加/删除单行注释ctrl+/ 增加/删除多行注释ctrl+shift+/ html注释!---- css注释/*...

2021-07-12 11:32:53
代码技巧之常用快捷键的整理

z-index的特点

思路: ➥z-index的结构/定位元素默认的z-index ➥z-index单位 ➥能不能用子元素和父元素比较 ➥父元素没有z-index,能不能通过子元素控制他们的层级=改变层级,父元素z-inde...

2021-07-12 11:29:57
z-index的特点

手机端