Blogger Information
Blog 2
fans 0
comment 0
visits 1485
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
常见HTML标签
HS 、的博客
Original
655 people have browsed it

实例

<!DOCTYPE html>
<html>
<head>
	<title>文本控制</title>
	<meta charset="utf-8">
</head>
<body>
<h1>这是一个h1标签</h1>
<h2>这是h2标签</h2>
<h3>这是h3标签</h3>
<h4>这是h4标签</h4>
<h5>这是h5标签</h5>
<h6>这是h6标签</h6>
<b>这是粗体标签</b>
<p>大多数网站都充满了图像和脚本,这可能是性能的巨大瓶颈。<br>谷歌意识到性能问题,该公司正在开发一项名为图像延迟加载的新功能,以加快网页页面加载速度。<br>最新的Canary版Google Chrome浏览器将增加延迟加载功能。
</p>
<br>
<br>
<strong>php中文网</strong>
<i>大多数网站都充满了图像和脚本</i>
<em>定义着重字</em>
<del>定义删除字标签</del>
<span style="background: pink;width:300px;height: 300px">399元</span><!-- 行内:可以共存于一行   对宽高属性设置不生效 -->
<del>499元</del>
<pre>预  格式化
文本
</pre>
<p style="background: #ccc;width:300px;height: 300px">123</p><!-- 块级元素:div h1~h6 p from table ul列表   独占一行   对宽高属性设置生效 -->
<span>399元</span>
<!-- 块级元素:div h1~h6 p from table ul列表   独占一行   对宽高属性设置生效
行内:可以共存于一行   对宽高属性设置不生效 -->
<!-- 行内块元素:结合了块级以及行内的特点 -->
<img src="images/1.jpg" style="width:100px;height: 300px"><span>123</span><!-- 行内块元素:结合了块级以及行内的特点 -->
行内块级相互转换:
display:inline  块级元素转换为行内
display:inline-block;块级元素转换为行内块元素
display:block;行内元素转换为块级
<div style="background: pink;display:inline;width:300px;height: 300px">1</div>
<div style="background: pink;display:inline-block;width:300px;height: 300px">2</div>
<span style="background: pink;display:block;width:300px;height: 300px">3</span>
<span style="background: pink;display:inline-block;width:300px;height: 300px">4</span><!-- 独占一行 因为上一行SPAN块级(block)属性继承 -->
<span style="background: pink;display:inline-block;width:300px;height: 300px">5</span><!-- 注意不独占一行 因为上一行(inline-block) -->


</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

 

实例

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>文本控制</title>
	<style type="text/css">
	    p{font-weight:bold;/*定义粗体*/
	    	 font-size:30px;/*字体大小*/
	    	 font-family: 楷体;/*定义字体*/
	    	}/*文本标题的效果*/	
	    h1{text-align:center;/*left*/
	    	height:100px;
	    	background:#ccc;
	        line-height: 100px;/*定义行高*/
	    }
	    span{font-size: 40px;font-weight:bold;font-family:georgia;}
	    img{width:300px;height:400px;}
	    b{display:block;
	      width:300px;
	      height:40px;
	      background: pink;
	      overflow: hidden;/*溢出隐藏*/
	      margin-bottom: 100px;
	      }
	    b:hover{overflow:visible;}/*默认值,内容不会被修剪,元素会被呈现在元素框之外*/

	</style>

</head>
<body>
<h1>PHP中文网</h1>
<p>PHP中文网</p>
<br>
<span style="color:#0081FF">G</span>
<span style="color:rgb(255,39,32)">o</span>
<span style="color:#FFDD07">o</span>
<span style="color:#0081FF">g</span>
<span style="color:#44CF36">l</span>
<span style="color:#FFDD07">e</span>

<!-- 图文混排 -->
<br>
<p style="display:inline-block;width:300px;height:400px;">
  文章称,洛佩斯在他位于圣保罗州、面积1600公顷的农场种植大豆——这场赌注在本月早些时候得到了回报,在北京对美国大豆征收关税后,中国买家开始大量南美大豆。这位农夫的大豆也卖出了迄今最高的价钱。

</p>
<img src="images/1.jpg">
<br>
<br>
<img src="images/1.jpg">
<b>文章称,洛佩斯在他位于圣保罗州、面积1600公顷的农场种植大豆——这场赌注在本月早些时候得到了回报,在北京对美国大豆征收关税后,中国买家开始大量南美大豆。这位农夫的大豆也卖出了迄今最高的价钱。</b>

<br>



</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例


 



实例

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>作业0813</title>
	<style type="text/css">
	h1 {text-align:center;}
	p  {text-align:right;}
	h6 {text-align:center;}
 


    </style>
</head>
<body>
   <h1>黄晓明出借账户涉股票操纵案,账户未冻结</h1>
   <span>2018-8 来源</span>
   <p style="color:blue;display:inline-block;">黄晓明</p><!-- 靠右未显示 -->
   <h3>原标题:黄晓明出借账户涉股票操纵案,账户未冻结</h3>
   <img src="images/HXM.jpg"><!-- 图片如何居中? -->
   <h6>黄晓明(资料图)</h6>
   <span>(来源)</span>
   <br><!-- 如何空行显示如图片? -->
   <br>
   <span>证监会一纸罚单同时引爆了资本圈和娱乐圈!8月10日证监会新闻发布会公布了一起高达18亿的天价罚单,被罚人叫高勇,号称“民间炒股大赛冠军”。这本来是股市的一则新闻,但却于当天引爆了娱乐圈。原因是一篇自媒体报道称该案涉及到影视明星黄晓明。
<br>
娱乐圈跟A股都在疯传“黄晓明卷入18亿股票操纵大案”的自媒体报道文章,昨天黄晓明工作室微博随即发出声明称“纯属造谣”。表示黄晓明并不认识高勇,也未参与过任何操纵股票行为和介入过任何相关调查,并表示上述提到的媒体报道为杜撰而来,将追究法律责任。
<br>
8月13日,有消息证实, 18亿股票操纵案公示文件中的黄某人账户,确为黄晓明本人账户,但是目前账户并没有被冻结,根据相关专业人士的说法,如果确实账户所有者本人在不知情的情况下账户被利用作案,则账户不会被冻结。从目前公开的这些信息看,黄教主应该是被身边某个非常信任的朋友给坑了,这个可能性比较高。



<br>

   	
   </span>
   <br>
   <p>责任编辑</p>


   <h5>本文由百家号作者上传并发布,百家号仅提供信息发布平台。文章仅代表作者个人观点,不代表百度立场。未经作者许可,不得转载。
</h5><!-- 怎样制作和图片一样的效果? -->


</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例



微信图片_20180816142111.jpg

Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post