关于CSS的新篇章——记录学习5/5/2018(有摘录部分

标签: CSS  HTML5

以下为HTML5的特殊字符,

出自:http://www.cnblogs.com/smyhvae/p/4850684.html


特殊字符

  •  :空格 (non-breaking spacing,不断打空格)
  • <:小于号(less than)
  • >:大于号(greater than)
  • &:符号&
  • ":双引号
  • ':单引号
  • ©:版权©
  • ™:商标
  • 绐:文字。其实,#32464是汉字的unicode编码。

要求背诵的特殊字符有: <>©


来一张表格,方便需要的时候查询:

特殊字符描述字符的代码
 空格符 
<小于号&lt;
大于号&gt;
&和号&amp;
人民币&yen;
©版权&copy;
®注册商标&reg;
°摄氏度&deg;
±正负号&plusmn;
×乘号&times;
÷除号&divide;
²平方2(上标2)&sup2;
³立方3(上标3)&sup3;

上标<sup> 下标<sub>

上小标这两个标签容易混淆,怎么记呢?这样记:b的意思是bottom:底部
举例:

O<sup>2</sup>    5<sub>3</sub>

效果:

Paste_Image.png


三、超链接

超链接有三种形式:

1、外部链接:链接到外部文件。举例:

<a href="02页面.html">点击进入另外一个文件</a>

a是英语anchor“锚”的意思,就好像这个页面往另一个页面扔出了一个锚。是一个文本级的标签。

href是英语hypertext reference超文本地址的缩写。读作“喝瑞夫”,不要读作“喝夫”。

效果:

Paste_Image.png

当然,我们也可以直接点进链接,访问一个网址。举例如下;

    <a href="http://www.baidu.com" target="_blank">点我点我</a>

超链接的属性

  • href:目标URL
  • title:悬停文本。
  • name:主要用于设置一个锚点的名称。
  • target:告诉浏览器用什么方式来打开目标页面。target属性有以下几个值:
    • _self:在同一个网页中显示(默认值)
    • _blank在新的窗口中打开
    • _parent:在父窗口中显示
    • _top:在顶级窗口中显示

title属性举例:

<a href="09_img.html" title="很好看哦">结婚照</a>

效果如下:



-------------------------------------------------以下记录部分原创内容----------------------------------------------------------

首先贴一张从百度百科偷来的盒子CSS的示意图。



关于自适应盒子的代码内容:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>box_Float</title>
	<style>
		/* 100+20*3=360 */
/* 		.bc{
	width: 360px;
	height:360px;
	text-align: center;
	margin: 0 auto;
} */
		.bc{
			width: 90%;
			padding-bottom: 90%;
		}
		.abc{		  
			width:26%;
			padding-bottom: 26%;
			background-color: orange;
			border-radius: 3%;
			float: left;
			margin: 1%;
		}
	</style>
</head>
<body>
	<div class="bc">
		 <div class="abc"></div>
		 <div class="abc"></div>
		 <div class="abc"></div>
		 <div class="abc"></div>
		 <div class="abc"></div>
		 <div class="abc"></div>
		 <div class="abc"></div>
		 <div class="abc"></div>
		 <div class="abc"></div> 
	</div>
	
</body>
</html>
效果~






版权声明:本文为u014406777原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/u014406777/article/details/80208665