Blogger Information
Blog 38
fans 0
comment 0
visits 30566
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
文本控制图文混排行、块、行块显示总结——2018年8月13日
图图的博客
Original
830 people have browsed it

实例

<!DOCTYPE html>
<html>
<head>
	<title>文本控制</title>
	<meta charset="utf-8">
</head>
<body>
<!-- h标签:h1到h6依次减小 -->
<h1>这是一个h1标签</h1>
<h2>这是一个h2标签</h2>
<h3>这是一个h3标签</h3>
<h4>这是一个h4标签</h4>
<h5>这是一个h5标签</h5>
<h6>这是一个h6标签</h6>
<b>这是一个粗体b标签</b><!-- 加粗 -->
<p>这是一个段落p标签</p><!-- 定义段落 -->
<br><!-- 换行 -->
<strong>加重语气:其实就是粗体</strong><br>
<i>斜体</i><br>
<p style="background: grey;"> p</p>
<em>定义着重字</em><br>
<del>定义删除字</del><br>
<pre>预格式化文本</pre><!-- 可输出空格和换行 -->
<!-- 块级元素:独占一行可以设置宽高
行内元素:可以共存不能设置宽高
行内块:结合了块和行内特点,既能设置宽高也能多个共存与一行 -->
<img src="images/1.jpg" style="width: 500px;"><!-- 行内快元素 -->
<div style="width: 100px;height:  background: blue;display: inline;">1</div><!-- 块转成行 -->
<div style="width: 100px;height:  background: pink;display: inline-block;">2</div><!-- 转化成行内块元素 -->
<span style="width: 100px;height: 100px;background:yellow;display: block;">a</span><!-- 转化成块元素 -->
<span>b</span>
<span style="width: 100px;height: 100px;background:red;display: inline-block;">c</span><!-- 转化成块元素 -->
<span style="width: 100px;height: 100px;background:green;display: inline-block;">d</span><!-- 转化成块元素 -->

</body>
</html>

运行实例 »

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

实例

<!DOCTYPE html>
<html>
<head>
	<title>文本控制</title>
	<meta charset="utf-8">
	<style type="text/css">
		span{font-weight: bold;/*字体粗体*/
			font-size: 40px;/*字体大小*/
			font-family: georgia;

			
		}
		h2{text-align: center;/*center居中、左对齐、右对齐*/
			background: yellow;
			height: 100px;
			line-height: 100px;/*定义行高*/
		}
		b{display: block;
			width: 40px;
			height: 300px;
			background: yellow;
			overflow: hidden;/*溢出隐藏*/
			margin-bottom: 10px;
		}
		b:hover{/*伪类选择器:鼠标移上去*/
			overflow: visible;/*显示内容*/
		}
	</style>
</head>
<body>
<span>wy23</span>
<h2>php</h2>
<hr>
<span style="color: rgb(10,130,242);">G</span>
<span style="color: rgb(251,27,33);">o</span>
<span style="color: rgb(254,231,32);">o</span>
<span style="color: rgb(10,130,242);">g</span>
<span style="color: rgb(56,254,41);">l</span>
<span style="color: rgb(251,27,33);">e</span>
<hr>
<!-- 图文混排 -->
<p style="display: inline-block;">手抄代码-总结</p>
<img src="images/1.jpg" style="width: 300px">
<hr>
<img src="images/1.jpg" style="width: 300px;height: 400;">
<b style="width: 300px;height: 50px;">在节目中汪涵细数自己的过往,声称在天天已经是44岁了,自已从34岁到了这个节目中可以说是看着兄弟们一起长大的。如今到了这个时候胡子也白了,站在舞台上汪涵表示特别想对老的天天向上的兄弟们说我对不起你们。你们每一个人因为种种原因而离开了这个地方,我这个做大哥的其实有很大很大的一部分责任</b>
</body>
</html>

运行实例 »

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

作业代码

实例

<!DOCTYPE html>
<html>
<head>
	<title>黄晓明出借账户被卷股票操纵案 知情人:账户未冻结</title>
	<meta charset="utf-8">
	<style type="text/css">
		div{width:640px;margin: 0 auto; }
		p{font-size: 16px;}
	</style>
</head>
<body>
<div>
	<h1>黄晓明出借账户被卷股票操纵案 知情人:账户未冻结</h1><!-- 标题 -->
	<img src="images/1.jpeg" style="display: block; width: 640px;"><!-- 注意:需要改成块显示才能居中 -->
	<p>(来源:财新报)</p>
	<p>搜狐娱乐讯 8月13日,据财新报道,记者证实,证监会刚刚公布的获利近9亿元、罚没款高达18亿元的高勇股票操纵案中的自然人账户之一确实为影视明星黄晓明名下账户。</p>
	<p>而接近监管层的人士表示,这些自然人账户的所有人如果仅仅是出借账户,并不知道账户被利用进行shichang操纵,这些账户也不会被冻结。</p>
	<p>8月10日晚,证监会通报了5宗时长操纵案件,其中,高勇控制16个账户,操纵“精华制yao”,半年内股价暴涨300%,非法获利8.97亿,被证监会没收违法所得8.97亿元并处罚8.97亿元。</p>
	<p>根据证监会通报,高勇控制的16个账户,这些账户是黄某、张某燕、张某、吴某江、倪素某、倪松某、姜某、黄某明、徐某、朴某娜、薛某、吴某丰、崔某欣、吴某等人的账户。</p>
	<p>媒体“股票说”调查表示,名单中,黄某就是明星黄晓明:“黄某明账户开立后由其母亲张某霞管理使用。经路某介绍,张某霞将黄某明证券账户部分委托高勇管理,该账户涉案交易由高勇作出。黄晓明的母亲叫张素霞。黄晓明和母亲张素霞,跟证监会通报材料中的黄某明和其母亲张某霞,正好一一对应!”</p>
	<p>黄晓明工作室对此发声明否认,称黄晓明不认识高某,未参与过任何操纵股票的行为;黄晓明未曾受过任何与股票有关的处罚,亦未介入过任何与股票有关的调查。黄晓明工作室还敦促相关方即刻删撤一切虚假信息,以免对公众造成误导并导致己方法律责任的承担。</p>
</div>
</body>
</html>

运行实例 »

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

运行效果

QQ截图20180813234014.png

手抄代码:

QQ截图20180813233515.png

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