如何用html语言使文本框居中

如何用html语言使文本框居中,第1张

1、在准备编辑HTML网页之前,先了解一下HTML代码的基础知识。

学习不同标签,你可以使用它们改变字号或者文本格式。比如在括号内的“b”用来把字体加粗。“i”用来表示斜体字。在代码中不要包括引号。

练习使用配对标签。大多数格式标记需要两个标签,分别在文本的开头和结尾。第一个标签将包括标签括号内(<>)的字母和符号。第二个标签将包括一个反斜线,并位于标签之前。例如,在加粗的文本开头的括号内插入“b”,并在文本结尾的括号内插入“/b”。

2、找出在网页中想要居中的文本。

3、在文本开头之前的括号内插入标签“center”。不要在标签和文本之前包括空格。

4、在文本结尾后的括号内插入“/center”。不要包括空格。

5、保存你的网页。浏览网页看看文本是否按要求对齐。

如果没有改变文本的对齐方式,那么需要运用一个程序,比如HTML5这样使用CSS而不是HTML代码的程序。试试用第二种方法来正确的对齐文本。

1、新建一个html文档,可以用任何文本编辑器,这里演示用Dreamweaver软件,新建并保存html文档。

2、然后写html代码,写一个input文本输入框id为inputId,然后写一个按钮,id为buttonId,这里要做的是点击按钮就为输入框赋值。

3、然后把输入框和按钮的css样式写好,当然不写样式也可以,这里主要是为了美化一下。

4、打开浏览器测试一下,点击按钮之后输入框内自动居中了,如下图所示。

可以用增高行距的办法变通实现垂直居中,完整代码如下:

<html>

<head>

<style>

body{TEXT-ALIGN: center}

#center{ MARGIN-RIGHT: auto

MARGIN-LEFT: auto

height:200px

background:#F00

width:400px

vertical-align:middle

line-height:200px

}

</style>

</head>

<body >

<div id="center"><p>test content</p></div>

</body>

</html>


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/8311402.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-15
下一篇 2023-04-15

发表评论

登录后才能评论

评论列表(0条)

保存