css - margin-padding
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
body{
background-color: #666;
} h1{
background-color: #fff;
display: inline-block;
height: 80px;
width: 80px; /* 内边距 */
padding: 2%;
/* 外边距 */
margin: 2%; /* 上、右、下、左 ->2% */
margin: 2% 2% 2% 2%;
/* 上下、左右 */
margin: 2% 0;
/* 上、左右、下 */
margin: 2% 4% 2%;
} /* 听说过负margin吗.... */
</style>
</head>
<body>
<h1></h1>
</body>
</html>
css - margin-padding的更多相关文章
- css margin padding 四个方向
margin 和padding虽然有四个单独的方向属性,如margin-left,padding-bottom等等. 但是可以用margin:2px 3px 4px 5px 四个参数的含义:上 ...
- 【转】图解CSS的padding,margin,border属性(详细介绍及举例说明)
W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层.盒模型主要定义四个区域:内容(content).边框距(p ...
- HTML CSS——margin与padding的初学
下文引自HTML CSS——margin和padding的学习,作者fengyv,不过加入了一些个人的看法. 你在学习margin和padding的时候是不是懵了,——什么他娘的内边距,什么他娘的外边 ...
- CSS中padding和margin以及用法
CSS中padding与margin 1.padding:内边距,表示控件内容相对于边缘的距离. 2.margin:外边距,表示控件边缘相对于父空间的边缘. 参考:http://www.studyof ...
- [转]图解CSS的padding,margin,border属性(详细介绍及举例说明)
图解CSS的padding,margin,border属性 W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层 ...
- DIV+CSS布局重新学习之float/margin/padding
之前对div的css布局一直有点半知半解,只其然却不知其所以然,到网上下载了“十天学会DIV+CSS(WEB标准)”的chm电子版,然后跟着练习了一下,特在此记录,备忘. <!DOCTYPE h ...
- 图解CSS的padding,margin,border属性(详细介绍及举例说明)
图解CSS的padding,margin,border属性 W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层 ...
- css 行内元素 块元素 替换元素 非替换元素 以及这些元素的width height margin padding 特性
一.各种元素的width height margin padding 特性(具体css元素的分来参看二) 1.块级元素 width. height. margin的四个方向. padding的四个方向 ...
- css之margin && padding讲解
margin && padding盒子模型: margin是模块与模块的空隙,padding是内容与边框的空隙 注: 1.margin:边缘.空白 2.padding:填充 margi ...
- 巧用margin/padding的百分比值实现高度自适应(多用于占位,避免闪烁)
本文依赖于一个基础却又容易混淆的css知识点:当margin/padding取形式为百分比的值时,无论是left/right,还是top/bottom,都是以父元素的width为参照物的!也许你会说, ...
随机推荐
- 细说robots.txt
robots.txt Robots协议(也称为爬虫协议.机器人协议等)的全称是“网络爬虫排除标准”(Robots Exclusion Protocol),网站通过Robots协议告诉搜索引擎哪些页面可 ...
- docker从零开始 存储(三)bind mounts
使用bind mounts 自Docker早期以来bind mounts 一直存在.与volumes相比,绑定挂载具有有限的功能.使用bind mounts时,主机上的文件或目录将装入容器中.文件或目 ...
- Python 进阶 之 函数对象
Python的世界里,万物皆对象,函数当然也是: 首先要定义一个函数: def add(a,b): print a+b 其次定义一个字典来引用该函数: dic = {"add":a ...
- (一)安装openvpn服务器端
环境 centos版本 [root@localhost ~]# cat /etc/redhat-release CentOS Linux release 7.4.1708 (Core) 关闭cento ...
- 在web项目下注册MySQL数据库驱动失败
java.lang.ClassNotFoundException: com.mysql.jdbc.Driver at org.apache.catalina.loader.WebappClassLoa ...
- Request 部分功能
Request 六大功能: 1.获取客户端请求信息: getRequestURL方法 -- 返回客户端发出请求完整URL getRequestURI方法 -- 返回请求行中的资源名部分 getQuer ...
- 【转】SonarQube配置自定义的CheckStyle代码规则
原文地址:https://www.jianshu.com/p/ff1d800885ce 惯例第一步肯定是SonarQube的安装与运行配置了,但这部分不在本文主题内,网上一搜一大把,这里就不讲了,大家 ...
- (24)python 无线破解
import pywifi import time wifi = pywifi.PyWiFi() # iface = wifi.interfaces()[0]#获取第一块网卡 #print(iface ...
- poj1860(Bellman—fold)
题目连接:http://poj.org/problem?id=1860 Description Several currency exchange points are working in our ...
- Apache Kafka 企业级消息队列
1.大纲 了解 Apache Kafka是什么 掌握Apache Kafka的基本架构 搭建Kafka集群 掌握操作集群的两种方式 了解Apache Kafka高级部分的内容 2.消息系统的作用是什么 ...