盒子模型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. selenium和AutoIt工具辅助下载和上传

    上传 根据AutoIt Windows Info 所识别到的控件信息打开SciTE Script Editor编辑器,编写脚本. ;ControlFocus("title",&qu ...

  2. adb 连接夜神和逍遥模拟器

    然后运行cmd命令,cd到夜神安装目录,执行命令 adb connect 127.0.0.1:62001 nox_adb.exe connect 127.0.0.1:62001 逍遥模拟器 adb c ...

  3. 其他综合-Kickstart无人值守安装系统CentOS 7

    Kickstart无人值守安装系统CentOS 7 1.概述 1.1 关于PXE Preboot Execution Environment 翻译过来就是预启动执行环境:简称 PXE :传统安装操作系 ...

  4. 06webpack-- html-webpack-plugin的2个作用

    <!-- 15 html-webpack-plugin的2个作用 下载 cnpm i html-webpack-plugin -D 作用在==>内存中生成页面 在webpack中 导入在内 ...

  5. 非root用户安装、配置mysql

    1. 下载mysql,可能是因为服务器操作系统版本较低(CentOS4.3),安装5.7时提示缺lib,刚好我不需要一定安装新版,所以下载了5.1 Linux - Generic (glibc 2.5 ...

  6. django之三剑客、静态文件配置、请求响应对象、数据库操作

    三剑客 from django.shortcuts import render,HttpResponse,redirect HttpResponse # 返回字符串 render(response, ...

  7. 论文阅读笔记五十七:FCOS: Fully Convolutional One-Stage Object Detection(CVPR2019)

    论文原址:https://arxiv.org/abs/1904.01355 github: tinyurl.com/FCOSv1 摘要 本文提出了一个基于全卷积的单阶段检测网络,类似于语义分割,针对每 ...

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

    一.案例环境描述 1.环境准备 2CPU,4GB内存 预先安装docker sysstat工具 2.温馨提示 案例中 Python 应用的核心逻辑比较简单,你可能一眼就能看出问题,但实际生产环境中的源 ...

  9. [LeetCode] 208. Implement Trie (Prefix Tree) 实现字典树(前缀树)

    Implement a trie with insert, search, and startsWith methods. Example: Trie trie = new Trie(); trie. ...

  10. [LeetCode] 104. Maximum Depth of Binary Tree 二叉树的最大深度

    Given a binary tree, find its maximum depth. The maximum depth is the number of nodes along the long ...