CSS设置文字在div的中央显示（转）

网址来源：http://keleyi.com/a/bjac/n1j9gb06.htm

#divId_keleyi_com {
width: 200px;
height: 40px; /*div的高度*/
line-height:40px; /*/这个数值要和height高度相等，才能控制文字上下居中*/
text-align:center; /*/控制文字左右居中*/

color: #FB592B; /*/字体颜色*/
font-size:25px;
}
<div id="divId_keleyi_com">柯乐义keleyi.com</div>

效果如下：

时间： 2024-10-20 23:42:03

CSS设置文字在div的中央显示（转）的相关文章

如何利用CSS设置文字的阴影效果

如何利用CSS设置文字的阴影效果:建议:尽可能的手写代码,可以有效的提高学习效率和深度.有时候需要给文字加上阴影,下面就结合实例简单介绍一下如何给文字加上阴影效果.先看一段代码实例: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/"

几个简单的css设置问题：div居中，ul li不换行，内容超出自动变省略号等

1 div在页面居中的问题 1)position值为relative时(相对定位),css设置属性margin:0 auto;(0 auto,表示上下边界为0,左右则根据宽度自适应相同值,即居中)即可. 2)position值为relative时(绝对定位),css设置属性 text-align:center; left:50%; margin-left:-500px;(左边距margin-left设置为当前div宽度的一半的负值即可). 代码示例: .page { position:

用CSS让文字居于div的底部

css对文字的布局上没有靠容器底部对齐的参数,目前使用的一个不错的方法也比较好.就是用position属性来解决,看下面的代码,用position的相对和绝对定位功能也轻松的实现了,文字靠近div低部对齐,并且靠近的距离还可以精确到像素,自己可以调节,是不是很不错呢? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd&q

css设置文字不换行并显示省略号

1.单行文本显示省略号 width:value(具体的值):设置容器具体的宽度 white-spacing:nowrap:强制文本在一行内显示 overflow:hidden:溢出内容为隐藏 text-overflow:ellipsis:溢出文本显示省略号 2.多行文本显示省略号 display:-webkit-box; -webkit-box-orient:vertical; overflow:hidden: text-overflow:ellipsis: -webkit-line-clamp

css设置文字中间的小竖线

主要css属性是border-right border-right:1px solid gray; padding-right:10px; padding-left:10px; <div data-bind="foreach:RequestListAll"> <a class="PositionName" style="display: block;color:gray; float: left; font-family: 微软雅黑; f

CSS设置文字大小自适应功能

<span id="topaccount" style="font-size:3rem;color:red;">NANA</span> <span> 这是html的某一个页面的span里面的东西我想让它自适应显示设备儿变大变小font-size:3rem 1rem=16px 然后我只要设置html的属性,然后具体哪个标签要固定死就让他为固定的值.其他的值为3rem的百分比 <style> @media screen

css设置文字上下居中，一行文字居中，两行或多行文字同样居中,附带效果图

附图: 1. 利用Flex布局实现 demo.html 1 <div class="demo demo-flex"><span>孤云将野鹤,岂向人间住.莫买沃洲山,时人已知处.</span></div> style.css 1 .demo { 2 width: 120px; 3 height: 200px; 4 border: 1px solid red; 5 /*line-height: 25px;*/ 6 font-size: 12p

使用CSS设置文字不可选

可以使用user-select属性实例: 1 .noselect { 2 -webkit-touch-callout: none; 3 -webkit-user-select: none; 4 -khtml-user-select: none; 5 -moz-user-select: none; 6 -ms-user-select: none; 7 user-select: none; 8 } <p> Selectable text. </p> <p class="

Css设置文字旋转

.test{ -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); display: block; position: absolute; filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3) } <span class="test">2009</span> 结果: 原文地址:https://www.cnblo