--在html常常用到居中

--1、可以用<center></center>

--2、可以用css

演示代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page language="java" contentType="text/html;charset=UTF-8" %>
<head>
<title>演示居中</title>
<link rel="stylesheet" type="text/css" href="../css/mycss.css">
</head>
<body>
<center>
下面是当前演示
</center> <div id="position">水平垂直居中的对象</div> <style type="text/css">
/*用css注释 */
#position{position:absolute;top:50%;left:50%;width:150px;height:40px;margin:-20px 0 0 -75px;padding:0 10px;background:#eee;line-height:2.4;}
</style>
</body>
</html>

--效果图

css实现居中的更多相关文章

  1. 【转】css布局居中和CSS内容居中区别和对应DIV CSS代码

    原文地址:http://www.divcss5.com/jiqiao/j771.shtml css布局居中和CSS内容居中区别和对应DIV CSS代码教程与图文代码案例篇 对于新手来说DIV CSS布 ...

  2. 使用Flexbox实现CSS竖向居中

    竖向居中需要一个父元素和一个子元素合作完成. <div class="flexbox-container"> <div>Blah blah</div& ...

  3. CSS标签居中

    CSS标签居中是相对于父标签说的,即在父标签的中居中.通常是在子标签中使用margin:0 auto,来使子标签居中.此外子标签需要有固定的宽度才行,比如 子标签为div时,div的宽度默认占父标签的 ...

  4. css常用居中

    对一个已知大小的元素上下左右居中(已知大小了,直接margin也就行了): css如下:.parent{height:100px;width:100px;background:grey;positio ...

  5. CSS 图像居中对齐

    CSS  图像居中对齐 我们在<CSS 内外边距>学过内容居中,它的原理是将外边左右设置为auto.图像居中也是这个原理. 示例 <!DOCTYPE html> <htm ...

  6. css图片居中(水平居中和垂直居中)

    css图片居中(水平居中和垂直居中) css图片居中分css图片水平居中和垂直居中两种情况,有时候还需要图片同时水平垂直居中,下面分几种居中情况分别介绍. css图片水平居中 利用margin: 0 ...

  7. CSS中居中的完全指南(中英对照翻译)

    翻译自:https://css-tricks.com/centering-css-complete-guide/ Centering things in CSS is the poster child ...

  8. css左右居中的几种常见方法

    本人是前端的新人,这是第一次写技术博客,各位大大,本文有错误请指正,手中的板砖尽量轻拍,我怕疼~~ 对于水平居中和垂直居中我也用过很多方法,但是有的时候管用有的时候又嗝屁不好使了.涉及到的情况很多,所 ...

  9. 用CSS实现居中的方式

    直接放链接吧,最近大量时间放在看书上了,不想玩游戏,不想看电影,只想看书,早日做出自己的网站卖广告. CSS居中

  10. CSS布局——居中

    参考文章1.CSS布局奇淫技巧之--各种居中 2.http://www.imooc.com/article/2235 1.行内元素水平居中text-align:center对图片,按钮,文字等行内元素 ...

随机推荐

  1. 基于Node.js的实时推送 juggernaut

    基于Node.js的实时推送 juggernaut Juggernaut 基于 Node.js 构建.为浏览器和服务器端提供一个实时的连接,可在客户端和服务器端进行数据的实时推送,适合多角色游戏.聊天 ...

  2. URL的格式scheme

    url scheme: scheme + (://) + userinfo + (@) + hostname + (:) + port + path + (?) + query + (#) + fra ...

  3. Web Service学习之九:Restful WebService

    1.Rest 2.Rest webService 3.SpringMVC Restful 参考: http://spring.io/guides/gs/rest-service/ http://www ...

  4. HDU 5805 NanoApe Loves Sequence (模拟)

    NanoApe Loves Sequence 题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=5805 Description NanoApe, the ...

  5. 在线判题 (模拟)http://202.196.1.132/problem.php?id=1164

    #include<stdio.h> #include<math.h> #include<string.h> #include<stdlib.h> #de ...

  6. UVaLive 7370 Classy (排序,比较)

    题意:给定 n 个人,和他们的数进行比较,从后面开始比,如果不够长,加middle接着比,直到没有,如果还相同比名字. 析:很水的题,就不用说了. 代码如下: #pragma comment(link ...

  7. PHP实现基于Swoole简单的HTTP服务器

    引用Swoole官方定义: PHP语言的异步.并行.高性能网络通信框架,使用纯C语言编写,提供了PHP语言的异步多线程服务器,异步TCP/UDP网络客户端,异步MySQL,数据库连接池,AsyncTa ...

  8. python字符串相关的函数

    有些是字符串对象的方法,有些是内建库的方法 split分割字符串 find 查找字符串 for c in str:  遍历字符串 len 获取字符串长度 int    将字符串转换成int str   ...

  9. Zabbix3.0完整部署

    0. 准备工作 0.1 初始化 #!/bin/sh yum clean all systemctl stop firewalld.service systemctl disable firewalld ...

  10. 【转】部署web项目到weblogic上启动错误

    启动weblogic报错:java.lang.ClassCastException: com.sun.faces.application.WebappLifecycleListener cannot ...