笔记-文本

最新推荐文章于 2022-05-27 21:12:19 发布

sinat_34301608

最新推荐文章于 2022-05-27 21:12:19 发布

阅读量227

点赞数

分类专栏：随手记文章标签：文档

本文链接：https://blog.csdn.net/sinat_34301608/article/details/53126763

版权

随手记专栏收录该内容

8 篇文章 0 订阅

订阅专栏

<style type="text/css">
	.d1{

		text-align: all;/*定义文本居中对齐 */
		letter-spacing: 3px;/*定义文字间隔 */
		text-indent: 2em;/*定义首行缩进 */
		line-height: 30px;/*定义行高 */
		text-transform: lowercase;/*定义字体大小写*/
		text-decoration: line-through;/*定义字体加中线*/
		word-break: break-all;/*从多出去的文本那强制截断 */
		font-style: italic;/*定义字体斜体*/
         font-weight:bold;/*定义字体粗细*/

	}	
	</style>

transform: rotate(22deg);定义旋转的度数。background-origin：content-box从原点开始放，是背景图片摆放时参考的位置，参考位置为content-box，border-box以border-box左上角为原点， padding-box以padding为左上角，

background：green url() no-repeat 10px 10px;

font-family:serif:

font-family:

font-weight:字体粗细，bold粗体，lighter细点，normal细点

font-style：添加字体样式，italic斜体；

/*文本 */

text-indent:2 em;文本缩进首行

text-align文本对齐；

letter-spacing:3px;字符中间间歇；

text-transform：uppercase 大写，lowercase小写 capitalize 首字母大写

text-decoration:line-through中线字体中加线，

Word-break：break-all；全部打破强制截断文本从多出去的开始截断；normal 不破坏保留单词；就是换行差不多，

line-height 行高；就是文本在一行所占的高度，文本在一行内垂直居中

letter-spacing:2px;字符中间的间歇

vertical-align:图片和文字调整他的位置，和inline-block搭配更好；

<title>调整</title>
	<meta charset="utf-8">
	<style type="text/css">
	#d1{
		width: 600px;
		height: 200px;
		border:1px solid orange;
		vertical-align:top;
	}
	#d1 img{
		display: inline-block;
		vertical-align:middle;/*调成文字和图片的位置middle文字在图片的中间*/
	}
	#d1 p{
		display: inline-block;

	}


		
	</style>
	
</head>
<body>
<div id="d1"><img src="i.jpg"><p>啦啦啦啦啦啦啦</p></div>

</body>
</html>

效果图：