html+css+js Web开发学习——3

a——链接

用于创建其它网页的链接、也可以链接到网页的其它位置(称为锚链接)。
有如下属性:id、style、class这些通用属性就不说了
1、href,指定连接到的URL。可以是相对路径或绝对路径。
2、title,用于鼠标悬停的连接上然后会显示的文字注释
3、name,定义一个可链接到的锚,用于不支持通过id来链接页面元素的浏览器
4、rel,描述当前文档和链接文档之间的关系。可选值参考
例子如下:
<!DOCTYPE html>
<html>
	<head>
		<title>1111</title>
	</head>
	<body>
		<a href="http://www.baidu.com" title="aaaa">链接到百度首页</a>
		<br>
		<a href="file:///E:/web学习/one.html#h15">链接到某页面中id为h15的元素</a>
		<br>
		<a href="#h24">链接到页面中id为h24的元素,当前页面的元素可以不加URL</a>
		<h1 id="h1">hahaha1<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h2">hahaha2<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h3">hahaha3<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h4">hahaha4<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h5">hahaha5<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h6">hahaha6<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h7">hahaha7<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h8">hahaha8<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h9">hahaha9<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h10">hahaha10<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h11">hahaha11<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h12">hahaha12<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h13">hahaha13<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h14">hahaha14<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h15">hahaha15<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h16">hahaha16<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h17">hahaha17<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h18">hahaha18<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h19">hahaha19<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h20">hahaha20<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h21">hahaha21<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h22">hahaha22<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h23">hahaha23<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h24">hahaha24<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h25">hahaha25<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h26">hahaha26<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h27">hahaha27<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h28">hahaha28<br>hahaha<br>hahaha<br>hahaha<br></h1>
		<h1 id="h29">hahaha29<br>hahaha<br>hahaha<br>hahaha<br></h1>
	</body>
</html>

标签a中rel属性的可选值

描述
alternate文档的可选版本(例如打印页、翻译页或镜像)。
stylesheet文档的外部样式表。
start集合中的第一个文档。
next集合中的下一个文档。
prev集合中的前一个文档。
contents文档目录。
index文档索引。
glossary文档中所用字词的术语表或解释。
copyright包含版权信息的文档。
chapter文档的章。
section文档的节。
subsection文档的子段。
appendix文档附录。
help帮助文档。
bookmark相关文档。
nofollowGoogle 使用 “nofollow”,用于指定 Google 搜索引擎不要跟踪链接。
licence
tag
friend

如何设置显示字符的格式

1、使用语义标签
2、使用css样式

使用语义标签设置显示字符格式:

1.<em>:斜体
2.<strong>:粗体
3.<code>:表示其包含的文本是代码示例,应使用Courier等等宽字体显示。
4.<samp>:同<code>
5.<kbd>:表示需要用户输入的文本,等宽字体
6.<var>:表示需要用实际值替换的变量或其他实体的名称,显示为斜体或带下划线
7.<dfn>:用于突出要定义或刚定义的单词,通常是斜体
8.<cite>:表示引用的作品名,斜体
9.<abbr>:表示缩略语

使用CSS样式设置显示字符格式:

需要先提一下,大多数标签都会以某种方式影响其包含的文本的外观,但是有一个标签对其包含的文本没有任何影响,这就是<span>,他的存在目的就是要与样式表相关联。
单独使用<span>标签不会有任何效果,需要与属性style结合使用,可以达到所有的语义标签效果,而且会更好。
下面列出style中可取的属性:
1.test-decoration,指定文本使用哪种装饰。
 可取值:1、underline:下划线
		2、overline:上划线
		3、line-through:穿过文本的线
		4、blink:闪烁
2.font-style,设置斜体。
 可取值:1、normal:默认值
		2、italic:斜体
		3、oblique:标准字体的倾斜版本
		4、inherit	:规定应该从父元素继承字体的粗细。
3.font-weight:设置加粗
 可取值:1、normal:默认值
 		2、bold:加粗
 		3、bolder:更粗
 		4、lighter:更细
 		5、100-900(以100为单位):400==normal,700==bold
 		6、inherit	:规定应该从父元素继承字体的粗细。
4.font-family:设置字体,通常字体名称有"serif"、"sans-serif"、"cursive"、"fantasy"、"monospace"
5.font-variant 属性设置小型大写字母的字体显示文本,这意味着所有的小写字母均会被转换为大写,但是所有使用小型大写字体的字母与其余文本相比,其字体尺寸更小。
 可取值:1、normal:默认值。浏览器会显示一个标准的字体。
		2、small-caps:浏览器会显示小型大写字母的字体。
		3、inherit:规定应该从父元素继承 font-variant 属性的值。
6.font-size:设置字体大小。
 可取值:1.xx-small、x-small、small、medium、large、x-large、xx-large:把字体的尺寸设置为不同的尺寸,从 xx-small 到 xx-large。默认值:medium。
	2.smaller:把 font-size 设置为比父元素更小的尺寸。
	3.larger:把 font-size 设置为比父元素更大的尺寸。
	4.length:把 font-size 设置为一个固定的值。
	5.%:把 font-size 设置为基于父元素的一个百分比值。
	6.inherit:规定应该从父元素继承字体尺寸。

pre——预定格式的文本

在pre标签内的内容,浏览器会原样显示,空格回车等不会删除。

hr——水平分隔线

该标签只支持所有标签都支持的属性。
默认情况是居中,可通过align=“left”、right、center设置。

br——换行

address——地址

通常用于给网页添加落款

常用的字符实体

显示结果描述实体名称实体编号
空格&nbsp&#160
<小于号&lt&#60
>大于号&gt&#62
&和号&amp&#38
"引号&quot&#34
撇号&apos(IE不支持)&#39
&cent&#162
£&pound&#163
¥人民币/日元&yen&#165
欧元&euro&#8364
§小节&sect&#167
©版权&copy&#169
®注册商标&reg&#174
商标&trade&#8482
×乘号&times&#215
÷除号&divide&#247
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值