html 居中对齐代码写法 _ 学做网站论坛

link管理

链接快照平台

输入网页链接，自动生成快照
标签化管理网页链接

相关文章推荐

行走的小摩托 · html如何取余 | PingCode智库· 3 周前 ·

纯真的包子 · 利用 HTML 模板自定义用户界面 - ...· 2 周前 ·

强健的冰淇淋 · webview如何载入本地html文件 | ...· 2 周前 ·

眉毛粗的柳树 · CSS属性：定位属性（图文详解） - ...· 3 月前 ·

不羁的领带 · 努比亚Z17MINI ROOT ...· 6 月前 ·

斯文的紫菜汤 · vba Error 429 in ...· 1 年前 ·

神勇威武的匕首 · 柯南新剧场版《黑铁的鱼影》预告公开 ...· 1 年前 ·

踏实的刺猬 · 招魂3_4K蓝光原盘|4K高清下载|高清版下 ...· 1 年前 ·

在做网站时，网页的文字往往需要进入居中排版，例如水平居中和垂直居中等。下面学做网站就来介绍一下常用的html 居中对齐代码写法。

HTML水平居中

HTML水平居中使用text-align属性来控制。代码写法如下：

< style >.test { text- align :center; } < / style >
< div class = "text" >文字水平居中< / div >

HTML垂直居中

HTML垂直居中的原理就是设置高度与行高相等。使用line-height属性来控制。代码写法如下：

< style >.test { height :40px;line- height :40px; } < / style >
< div class = "text" >文字垂直居中< / div >

HTML图片居中

HTML图片居中需要设置图片的左右外边距为auto；使用margin属性来控制。代码写法如下：

< style >.test img { width :200px; height :200px;display:block;margin: 0 auto; } < / style >
< div class = "text" >< img src = "../logo.png" / >< / div >

推荐文章

行走的小摩托 · html如何取余 | PingCode智库

3 周前

纯真的包子 · 利用 HTML 模板自定义用户界面 - Azure AD B2C | Microsoft Learn

2 周前

强健的冰淇淋 · webview如何载入本地html文件 | PingCode智库

2 周前

眉毛粗的柳树 · CSS属性：定位属性（图文详解） - 千古壹号 - 博客园

3 月前

不羁的领带 · 努比亚Z17MINI ROOT （Fastboot模式）_努比亚z17mini root-CSDN博客

6 月前

斯文的紫菜汤 · vba Error 429 in Office for Mac - Microsoft Community

1 年前

神勇威武的匕首 · 柯南新剧场版《黑铁的鱼影》预告公开明年4月上映_3DM单机

1 年前

踏实的刺猬 · 招魂3_4K蓝光原盘|4K高清下载|高清版下载 - 蚂蚁4k(mayi4k.com)

1 年前