CSS初级教程 边界和补白

边界margin和补白padding（依据国内出版社的翻译惯例，margin被翻译成边界，padding被翻译成补白，译者依照习惯翻译。但译者认为，margin翻译成外边距，padding翻译成内边距更为直白和形象。你可以依据自己的习惯来适应这两种不同的译法。译者注）是隔开元素最常用的两个属性。边界是元素外边的距离，而补白则是元素内部的距离。
为h2改进代码如下：

 代码如下 复制代码
h2 { 
font-size: 1.5em; 
background-color: #ccc; 
margin: 1em; 
padding: 3em; 
} 

你可以看到二级标题外围有一个字符的宽度，还很臃肿，因为在二级标题内部有3个字符宽度的补白。
元素的四边可以设置不同的值。margin-top、 margin-right、margin-bottom、 margin-left、padding-top、padding-right、padding-bottom和padding-left是无需解释的属性（看看英文字面意思啦）。
　　

 

时间： 2024-11-28 15:23:11

CSS初级教程 边界和补白的相关文章

七 CSS初级教程总结：属性结合起来使用

css|教程 如果你学完HTML初级教程即可学习CSS初级教程,使用CSS处理HTML样式. 下面的代码覆盖了初级教程的所有方面,保存下面的CSS文件并且在浏览器里观看连接的HTML,你可以明白各个CSS属性的用法.最好的学习方法就是理解作用在HTML上的CSS文件,改变CSS HTML会发生什么变化. body {font-family: arial, helvetica, sans-serif;font-size: 80%;color: black;background-color: #ff

CSS初级教程 选择符 属性和值

HTML有标签(tag),CSS就有选择符(selector).选择符就是赋予内部或者外部样式表的名字.在 CSS初级指南中,我们致力于HTML选择符,即是HTML的标签,用来改变一个指定标签的样式.每个选择符都有属性(properties)在大括号{}中,里面包括诸如color.font-weighth或者 background-color形式的字样.值(value)在半角英文引号:后面,用半角英文分号;隔离. body { font-size: 0.8em; color: navy; } 如

CSS初级教程-CSS结合JS的运用

利用CSS配合JavaScript的可以做很多更酷的动态页面效果,在本教程的最后给大家简单介绍一下CSS配合JS的应用.首先,要搞清楚事件和动作的概念.在客户端脚本中,JavaScript 通过对事件进行响应来获得与用户的交互.例如,当用户单击一个按钮或者在某段文字上移动鼠标时,就触发了一个单击事件或鼠标移动事件,通过对这些事件的响应,可以完成特定的功能(例如,单击按钮弹出对话框,鼠标移动到文本上后文本变色等). 下面介绍几种常见的事件: onClick:鼠标单击事件.(是指鼠标按下,然后松开时

CSS初级教程 边框

边框可以应用到在主体元素body中的绝大部分HTML元素中. 创建一个包围着元素的边框,你所需要的是边框样式border-style.它们的值可以是 solid.dotted.dashed.double.groove.ridge. inset和outset.(你有必要每个值都试一试,看看效果如何译者注) 边框宽度border-width为边框设置宽度,通常用像素来表示.当然,还可以单独设置四个方向的边框属性,它们是border-top-width.border-right-width. bord

CSS中级教程 class和id选择符

在CSS初级教程中我们仅仅考虑了HTML选择符──以HTML标签形式出现. 你当然可以用类选择符class和标识选择符id来定义自己的选择符. 这样做的好处是,依赖于class或者id,你可以不同地表现相同的HTML元素. 在CSS中,类选择符在一个半角英文句点(.)之前,而id则在半角英文井号(#)之前. 看起来像这样:  代码如下 复制代码 #top {  background-color: #ccc;  padding: 1em  }  .intro {  color: red;  fon

css中边界和补白:css中边界和补白

边界和补白HTMLDog指南 > CSS初级指南 > 边界和补白边界margin和补白padding(依据国内出版社的翻译惯例,margin被翻译成边界,padding被翻译成补白,译者依照习惯翻译.但译者认为,margin翻译成外边距,padding翻译成内边距更为直白和形象.你可以依据自己的习惯来适应这两种不同的译法.--译者注)是隔开元素最常用的两个属性.边界是元素外边的距离,而补白则是元素内部的距离.为h2改进代码如下:h2 { font-size: 1.5em; background

web标准建站:CSS入门教程

css|web|web标准|教程|入门教程 原创教程,转载请注明出处:网页教学网 CSS是"Cascading Style Sheets"的简称,中文翻译为"串接样式表",也有人翻译 为"样式表".CSS用以作为网页的排版和风格设计,在web标准建站中,对CSS的熟悉和使用 是相当重要的一个内容.CSS的作用是弥补HTML的不足,让网页的设计更为灵活. 这个文章只是为您介绍CSS的基础应用,指引您的一个入门的基础教程,主要目的是为 推进web标准

CSS入门教程

css|教程|入门教程 CSS是"Cascading Style Sheets"的简称,中文翻译为"串接样式表",也有人翻译为"样式表".CSS用以作为网页的排版和风格设计,在web标准建站中,对CSS的熟悉和使用是相当重要的一个内容.CSS的作用是弥补HTML的不足,让网页的设计更为灵活. 这个文章只是为您介绍CSS的基础应用,指引您的一个入门的基础教程,主要目的是为推进web标准贡献自己的微薄之力. 说点我自己的体会,现在有好多人都在推广WE

css模版教程全面自定义模板必备之css属性知识

核心提示:css模版教程,自定义模板必备之css属性知识. 该表只列出常用的CSS属性,及简要介绍其主要功能,若要了解各所有属性和具体的用法,请参考相关书籍 属 性 名 称 属性功能及其取值 用 法 说 明 与 范 例 颜色与背景类 color 设置文字颜色#rgb#rrggbbrgb(255,255,255)rgb(100%,100%,100%) H1{color:red}H1{color:#f00}H1{color:#ff0000}H1{color:rgb(255,0,0)}H1{color