HTML与CSS入门经典 笔记

2019-09-08 郑州网站建设  

margin和padding属性--------用于添加元素周围的间距(顺时钟顺序,都是上右下左)

align和float属性--------用于将元素相对其它内容放置

text-align和vertical-align------------控制网页内容的对齐

边距在元素之外,填充在元素之内

1.margin 样式单边距 此属性是处理元素外面的间距

可以设置边距为具体的长度(像素,点,ems)或者百分比。如是百分比,百分比是基于整个网页而不是元素大小的(margin-left=25%,表示元素的左边距将是整个页面宽度的25%)

margin属性包括margin-top;margin-right;margin-bottom;margin-left 分别是上,右,下,左边框的宽度值

2.padding 填充 在元素的矩形区域内部添加空间

3.border-width 定义四个边框的宽度:

border-width:border-top-width border-right-width border-bottom-width border-left-width; 分别是上,右,下,左边框的宽度值

4.text-align样式使其元素在其定界区域内水平对齐

5.vertical-align属性 使元素在垂直对齐。指定元素怎么与其父元素对齐(在有些情况下,是与网页中元素的当前行对齐)。“当前行”指的是显示在元素内的元素所处的垂直位置,换句话说,就是内联元素。

属性取值

top:将元素的顶部与当前行对齐

middle:将元素的中心与当前行对齐

bottom:将元素的底部与当前行对齐

text-top:将元素的顶部与父元素的顶部对齐

baseline:将元素的基线与父元素的基线对齐

text-bottom:将元素的底部与父元素的底部对齐

6.float属性使元素能在设计中到处移动,从而让其他元素围绕它们。元素的浮动是水平而不是垂直方向的,只有两种可能值:right和left.使用这两个值时,浮动元素将浮动到容器元素所允许的最右或者最左.

7.clear属性清除浮动元素

取值:left,right,both,none ,inherit

8.盒子模型

边距(margin)--> 边框(border)-->填充(padding)-->内容(content)

HTML与CSS入门经典 笔记

9.position属性 定位类型

relative:相对定位,默认定位类型。理解为棋盘上棋子的排列:棋子从左往右排列,达到边缘时移到下一行。棋子排列方式是由display决定。

样式属性display的值为block的元素自动放在下一行(默认),而为inline的元素自动放在同一行,位于前一个元素后面

absolute:绝对定位,能够指定元素的矩形局域相对于父元素区域的位置

属性值:

left:左边的位置偏移

right:右边的位置偏移

top:顶部的位置偏移

bottom:底部的位置偏移

10.z-index属性 控制元素的堆叠顺序。z-index值较大的元素在z-index值较小的元素上面

11.文本流(即内容流) 控制的样式属性有如下:

float: 决定文本怎么沿元素绕排 可设置为left或right 如将图像的float属性设置为left,图像将放在文本的左边

clear:禁止文本沿元素绕排

overflow:在元素太小而不能包含所有文本时控制文本的溢出方式,可设置为visible,hidden,scroll


河南郑州做网站首选天择文化,我们专注郑州网站建设网站设计网站制作与开发,是中原地区专业的郑州网络公司,多年来我们一直努力,服务客户数百家,欢迎您的咨询。
本文链接:郑州网络公司http://tzchb.ieyo.com/seo/1367.html转载请标明出处,谢谢合作!
标签:
  • 属性
  • -
  • margin
  • HTMLCSS
  • Padding