实例 <!Doctype html> <html> <head> <meta charset="utf-8"> <title>html文本控制</title> </head> <body> <h1>这是h1标签</h1> <!--标题标签h 从h1到h6,文字逐渐变细变小--> <h2>这是h2标签</h2> <h3>这是h3标签</h3> <h4>这是h4标签</h4> <h5>这是h5标签</h5> <h6>这是h6标签</h6> <p>斐讯的这几年的疯狂成长大家还是有目共睹的,但随着壁联事件的爆发,这个合作也受到了严重的冲击。 城门失火殃及池鱼,斐讯的日子不好过,<br><!--这个是换行标签-->那么之前和斐讯打的火热的合作商们,自然也陷入到了网友的声讨之中。 京东作为电商平台,自然受到了不小的影响,刘强东个人微博和京东官方微博一度陷入骂战之中,同时斐讯路由器的还有老牌的苏宁易购和国美。 </p><!--p标签是段落标签--> <b>我是粗体</b> <!--b标签是粗体标签--> <strong>我很粗,语气加重</strong> <!--strong标签也是是粗体标签--> <i>我是斜体</i> <br><!--br换行在标签里也能用--> <em>我也是斜体</em> <!--斜体体家中标签--> <del>我要降价了</del><!--删除字的标签--> <span>我是行标签</span> <!--行内元素是不可以设置长宽的--> <pre>斐讯的这几年的疯狂成长大家还是有目共睹的,但随着壁联事件的爆发,这个合作也受到了严重的冲击。 城门失火殃及池鱼,斐讯的日子不好过, 那么之前和斐讯打的火热的合作商们,自然也陷入到了网友的声讨之中。 京东作为电商平台,自然受到了不小的影响,刘强东个人微博和京东官方微博一度陷入骂战之中,同时斐讯路由器的还有老牌的苏宁易购和国美。</pre><!--格式化标签源码什么格式就显示什么格式字体都不一样--> <!--块级元素自带换行宽高自动默认为浏览器百分之百,当然也可以自定义宽高:div h1到h6 p 独占一行, 行内元素是可以共存于一行,对于宽高设置不生效有 I标签 strong b 标签,和span标签 行内块级元素有img标签 有块的可以设置长宽还可以同在一行--> <p style="width:100px;height:100px;background:red;">我要长宽和背景红</p> <img style="width:200px;height:200;"src="images/dede.jpg"> <span>我是span和图片好像是一行?img果然有行内元素属性</span> <!--下面演示块级转行内,行内转块级用相互转换 display inline inline-block --> <div style="width:100px;height:150px;background: pink; display:inline;">我是div块级标签马上我就用inline变成行内元素了,可惜我1米8大个没法显示</div> <div style="width:100px;height:200px;background:pink; display:inline-block;">我是div块级标签马上我就用inline-bolck变成行内块元素,我1米8大个可以显示</div> <span style="width:100px;height:200px;background:pink;display:block;">我是span行内元素马上我就用bolck变成块元素,我1米8大个可以显示了,哈哈!</span> <span style="width:100px;height:200px;background:pink;display:inline-block;">我是参考物</span> <span style="width:100px;height:200px;background:pink;display:inline-block;">我是span马上用display:inline—block变行内块</span> </body> </html> 内容关键点都带了注释。 运行实例 » 点击 "运行实例" 按钮查看在线实例<!Doctype html> <html> <head> <meta charset="utf-8"> <title>html文本控制</title> </head> <body> <h1>这是h1标签</h1> <!--标题标签h 从h1到h6,文字逐渐变细变小--> <h2>这是h2标签</h2> <h3>这是h3标签</h3> <h4>这是h4标签</h4> <h5>这是h5标签</h5> <h6>这是h6标签</h6> <p>斐讯的这几年的疯狂成长大家还是有目共睹的,但随着壁联事件的爆发,这个合作也受到了严重的冲击。 城门失火殃及池鱼,斐讯的日子不好过,<br><!--这个是换行标签-->那么之前和斐讯打的火热的合作商们,自然也陷入到了网友的声讨之中。 京东作为电商平台,自然受到了不小的影响,刘强东个人微博和京东官方微博一度陷入骂战之中,同时斐讯路由器的还有老牌的苏宁易购和国美。 </p><!--p标签是段落标签--> <b>我是粗体</b> <!--b标签是粗体标签--> <strong>我很粗,语气加重</strong> <!--strong标签也是是粗体标签--> <i>我是斜体</i> <br><!--br换行在标签里也能用--> <em>我也是斜体</em> <!--斜体体家中标签--> <del>我要降价了</del><!--删除字的标签--> <span>我是行标签</span> <!--行内元素是不可以设置长宽的--> <pre>斐讯的这几年的疯狂成长大家还是有目共睹的,但随着壁联事件的爆发,这个合作也受到了严重的冲击。 城门失火殃及池鱼,斐讯的日子不好过, 那么之前和斐讯打的火热的合作商们,自然也陷入到了网友的声讨之中。 京东作为电商平台,自然受到了不小的影响,刘强东个人微博和京东官方微博一度陷入骂战之中,同时斐讯路由器的还有老牌的苏宁易购和国美。</pre><!--格式化标签源码什么格式就显示什么格式字体都不一样--> <!--块级元素自带换行宽高自动默认为浏览器百分之百,当然也可以自定义宽高:div h1到h6 p 独占一行, 行内元素是可以共存于一行,对于宽高设置不生效有 I标签 strong b 标签,和span标签 行内块级元素有img标签 有块的可以设置长宽还可以同在一行--> <p style="width:100px;height:100px;background:red;">我要长宽和背景红</p> <img style="width:200px;height:200;"src="images/dede.jpg"> <span>我是span和图片好像是一行?img果然有行内元素属性</span> <!--下面演示块级转行内,行内转块级用相互转换 display inline inline-block --> <div style="width:100px;height:150px;background: pink; display:inline;">我是div块级标签马上我就用inline变成行内元素了,可惜我1米8大个没法显示</div> <div style="width:100px;height:200px;background:pink; display:inline-block;">我是div块级标签马上我就用inline-bolck变成行内块元素,我1米8大个可以显示</div> <span style="width:100px;height:200px;background:pink;display:block;">我是span行内元素马上我就用bolck变成块元素,我1米8大个可以显示了,哈哈!</span> <span style="width:100px;height:200px;background:pink;display:inline-block;">我是参考物</span> <span style="width:100px;height:200px;background:pink;display:inline-block;">我是span马上用display:inline—block变行内块</span> </body> </html>
内容关键点都带了注释。