html长度单位和水平居中总结part4

原创 2015年11月20日 00:00:34

1.对于长度单位的总结:px,em,%。

px:像素

如果在一个标签中,如p中 设置font-size:12px;那么重新写的一个标签中使用font-size:1em,那么该字体的大小12px*1

%:百分比
p{font-size:12px;line-height:130%}
此时的line_height为12px*1.3的大小。


2.水平居中的设置

对于行内元素(文本,图片等),可直接使用text-align:center来实现。


对于块状元素,可通过设置左右的margin 值为”auto”来实现居中,
margin:20px auto;/* margin-left 与 margin-right 设置为 auto */
或则是
margin-left:zuto;margin-right:auto;


而对于不定宽块状元素
不定宽度的块状元素有三种方法居中(这三种方法目前使用的都比多):
加入 table 标签
设置 display;inline 方法
设置 position:relative 和 left:50%;

版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

HTML元素水平居中方案总结

先来看我一个简单XHTML/HTML文件代码(部分),我们的目的是让#container水平居中。     content   Lorem ipsum dolor sit amet, c...
  • mrw223
  • mrw223
  • 2014年08月21日 10:10
  • 209

html中几种常见长度单位介绍

文章出处和来源网址:http://www.divcss5.com/html/h529.shtml以下是DIVCSS5为大家总结网页中常见html单位介绍,在css+div布局中长度单位介绍篇。其实cs...
  • mydo
  • mydo
  • 2015年03月11日 08:35
  • 632

html元素水平居中的几种方法

css的水平居中

HTML篇之CSS样式——CSS水平垂直居中对齐(多种方式)

用CSS来实现元素的垂直居中效果是件苦差事,虽然说实现方法有多种,但有很多方式在某些浏览器下可能无法正常的工作。接下来我们就一起来看看这些不同方法实现垂直居中的各自优点和其不足之处。  方法一:  ...

html中div如何水平和垂直居中的几种css方法代码

一、记录下几种盒子居中的方法: 1、margin固定宽高居中; 2、负margin居中; 3、绝对定位居中; 4、table-cell居中; 5、flex居中; 6、transform居中...

HTML元素水平居中方法详解

前言:有许多方法可以实现HTML页面元素水平居中显示,本篇博客我列举一下自己所知道的方法,如果有缺少的,欢迎大家回复。 一、text-align 适应范围:所有元素 在块级元素,如div中,设置其 t...
  • MOONCOM
  • MOONCOM
  • 2017年07月28日 10:07
  • 239

html中表格table的内容水平和垂直居中显示

html中表格table的内容居中显示 在CSS样式文件中指定#class td /*设置表格文字左右和上下居中对齐*/ { vertical-align: middle; t...

Extjs4 中垂直水平居中

想做个登陆框,用一个小formpanel垂直水平居中,而且可以适应浏览器窗口的变化,始终居中。很多文章都是写一个居中的div,然后将panel   render to 这个div中。用纯Extjs的方...

CSS水平居中设置总结

行内元素水平居中 当被设置元素为文本、图片等行内元素时,要实现其水平居中显示,给父元素设置 text-align:center 即可。 定宽块状元素水平居中 父元素设置 text-align:ce...

元素的水平居中总结

1.行内元素:这个比较简单,一般使用text-align:center就可。 Document #div1{ text-alig...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:html长度单位和水平居中总结part4
举报原因:
原因补充:

(最多只允许输入30个字)