盒子模型CSS(重点)

边框border    


边框通常使用连写border:1px(边框大小) solid(实线或其他)  red(颜色)

border-collapse:collapse (合并边框)

内边距padding


padding:10px 上下左右都为10

padding:10px 20px  上下为10px 左右为20px

padding:10 20 30 上10 左右 20   下为30

padding:上 右  下  左

padding、border会撑开具有 width height的盒子 解决方法padding的计算

外边距margin


margin:0 auto (auto为自动填充)

相邻的两个外边距会合并(显示值大的外边距)

嵌套块元素垂直外边距的合并 解决办法:1用border隔开  2用padding隔开  3用overflow:hidden

版心和布局流程


1.确定页面版心

2.分析页面中的行块元素,以及每个模块中的列模块

3.制作HTML结构

3.CSS初始化,然后开始运用模型的原型,通过CSS+DIV进行布局来控制网页的各个模块

HTML+CSS学习笔记整理二的更多相关文章

  1. Deep Learning(深度学习)学习笔记整理(二)

    本文整理了网上几位大牛的博客,详细地讲解了CNN的基础结构与核心思想,欢迎交流. [1]Deep learning简介 [2]Deep Learning训练过程 [3]Deep Learning模型之 ...

  2. HTML+CSS学习笔记整理

    一.标签语义化(重点): 1.可以方便代码的阅读和维护 2.同时让网络爬虫更好的解析从而更好的分析其内容 3.更好的优化引擎 如何做到标签语义化:个人理解是,首先,网页的HTML主要作用在网页的结构上 ...

  3. htm5 css学习笔记整理

    点击链接后退页面: <a href="javascript:history.go(-1)">回到上一个网页</a> ——修改placeholder提示的样式 ...

  4. Struts2学习笔记整理(二)

    这里是重点. Action接口 struts2 的Action可以是POJO 为了让用户开发的Action更加规范struts2提供了一个Action接口 ActionSupport基类 Struts ...

  5. Deep Learning(深度学习)学习笔记整理系列之(二)

    Deep Learning(深度学习)学习笔记整理系列 zouxy09@qq.com http://blog.csdn.net/zouxy09 作者:Zouxy version 1.0 2013-04 ...

  6. Django学习笔记(二):使用Template让HTML、CSS参与网页建立

    Django学习笔记(二):使用Template让HTML.CSS参与网页建立 通过本文章实现: 了解Django中Template的使用 让HTML.CSS等参与网页建立 利用静态文件应用网页样式 ...

  7. CSS学习笔记

    CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...

  8. Deep Learning(深度学习)学习笔记整理系列之(五)

    Deep Learning(深度学习)学习笔记整理系列 zouxy09@qq.com http://blog.csdn.net/zouxy09 作者:Zouxy version 1.0 2013-04 ...

  9. Yii框架学习笔记(二)将html前端模板整合到框架中

    选择Yii 2.0版本框架的7个理由 http://blog.chedushi.com/archives/8988 刚接触Yii谈一下对Yii框架的看法和感受 http://bbs.csdn.net/ ...

随机推荐

  1. jmeter5.1分布式压测

    在使用jmeter压测过程中,可能会度遇到内存溢出的错误,这是为什么呢?因为jmeter是java写的应用,java应用jvm堆内存heap受负载机硬件限制,虽然我们可以调整堆内存大小,但是单机无法支 ...

  2. Everybody Dance Now

    一.摘要 作者提出了一种简单的动作迁移方法,实现了"do as I do":给定一个人跳舞的源视频,作者可以在目标对象表演标准动作的短短几分钟后,将该表演转移到一个新的(业余的)目 ...

  3. Transformer---GPT模型

    一.GPT(Generative Pre-Training) GPT-2的模型非常巨大,它其实是Transformer的Decoder.GPT-2是Transformer的Decoder部分,输入一个 ...

  4. Window包管理工具scoop

    自定义安装路径安装 scoop安装应用路径 目标目录是D:\Program Files\Scoop,在PowerShell命令控制台中运行: [environment]::setEnvironment ...

  5. 20190922 「HZOJ NOIP2019 Round #7」20190922模拟

    综述 这次是USACO2019JAN Gold的题目. \(\mathrm{Cow Poetry}\) 题解 因为每句诗的长度一定是\(k\),所以自然而然想到背包. 设\(opt[i][j]\)代表 ...

  6. requests--文件上传,文件下载

    文件上传 在做接口自动化的时候,有时需要上传文件,比如更改头像等等,在request里,通过files参数来上传 import requests base_url = 'http://httpbin. ...

  7. 前端Vue项目——首页/课程页面开发及Axios请求

    一.首页轮播图 1.elementUI走马灯 elementUI中 Carousel 走马灯,可以在有限空间内,循环播放同一类型的图片.文字等内容. 这里使用指示器样式,可以将指示器的显示位置设置在容 ...

  8. Linux性能优化实战学习笔记:第三十一讲

    一.上节回顾 上一节,我们一起回顾了常见的文件系统和磁盘 I/O 性能指标,梳理了核心的 I/O 性能观测工具,最后还总结了快速分析 I/O 性能问题的思路. 虽然 I/O 的性能指标很多,相应的性能 ...

  9. 【可视化】Vue基础

    作者 | Jeskson 来源 | 达达前端小酒馆 Vue简介 Vue框架,框架的作者,尤雨溪,组件化,快速开发的特点. 生命周期 beforeCreate:组件刚刚被创建 created:组件创建完 ...

  10. [LeetCode] 864. Shortest Path to Get All Keys 获得所有钥匙的最短路径

    We are given a 2-dimensional grid. "." is an empty cell, "#" is a wall, "@& ...