这几天的自学总结汇总

最新推荐文章于 2019-04-24 18:00:53 发布

lianglizhongblog

最新推荐文章于 2019-04-24 18:00:53 发布

阅读量721

点赞数

分类专栏：前端自学总结文章标签： HTML dislpay block inline inline-block

本文链接：https://blog.csdn.net/lianglizhong1991/article/details/51972015

版权

前端自学总结专栏收录该内容

19 篇文章 0 订阅

订阅专栏

1.<body></body>里面的内容是网页显示的内容；

2.<hx>标签在<body></body>里面；

3.同时设置不同段落的字体大小和颜色：

例：让第一个段落和第二个段落的font-size都为16px。请不要为第二个段落添加 class 属性。

<style>

.color{color:red;}

P{font-size:16px;}

</style>

<pclass=“.color”>…</P>

注：1.“.color”中的“.”不能少；

2.分号“;”不要漏掉；

4.先定义后使用：

span{color:blue；}

<span>标签为文字设置单独样式

5.强调常用strong

6.短文本引用标签：<q>引用文本</q>

注意要引用的文本不用加双引号，浏览器会对q标签自动添加双引号。

7.长文本引用标签：<blockquote>引用文本</blockquote>

<blockquote>是定义块引用，显示效果是左、右两边进行缩进；

8.添加水平横线：<hr/> 注：没有结束标签

9.在网页中显示一行代码：<code>代码语言</code>

注：如果是多行代码，可以使用<pre>标签：<pre>语言代码段</pre>

10.ul-li在网页中显示的默认样式一般为：每项li前都自带一个圆点，且没有先后顺序；有先后顺序的为<ol>，<ol>在网页中显示的默认样式一般为：每项<li>前都自带一个序号，序号默认从1开始。

11.空格&nbsp，如果有多个的话，要加分号：&nbsp；&nbsp；&nbsp；

12.对于邮件：

1.可以省略<adress></adress>，直接用<a href=“”></a>；

2.网址： <ahref=“http://www.baidu.com”>http://www.baidu.com</a

>注：可以省略 http，只要保证有两条斜线//即可。

3.如果mailto后面同时有多个参数的话，第一个参数必须以“?”开头，后面的参数每一个都以“&”分隔。

4.邮箱：<a href=“mailto:XXX@163.com”>XXX@163.com</a> 注：必须要有 mailto：

13.使用<a>标签，链接到另一个页面：

<a href="目标网址" title="鼠标滑过显示的文本">链接显示的文本</a>

鼠标滑过显示的文本和链接显示的文本的内容是一样的。

14.在新窗口打开：<a href="目标网址" target="_blank">clickhere!</a>

15.插入图片：<img src="图片地址" alt="下载失败时的替换文本" title ="提示文本">

注：img元素是自关闭元素，不需要结束标记。下载失败时的替换文本是指图片不显示时所显示的文字

16.<tr>、<td>、<th>以及scope、row、col：<tr>表示表单中的一行，从属于<table>；<td>表示列，或者可以理解为一行里面的单元格,它从属于<tr>，即<td>是在<tr>内；所以表单可以有多行，每行可以有多个单元格。而<th>包含表头属性信息，scope用于标识表头，结合row（行）、col（列）来标识<th>的表头属性，即究竟这个<th>是行的表头还是列的表头？：

<html>
<body>
<table border="1">
<tr>
<th></th>
<th scope="col">Month</th>
<th scope="col">Savings</th>
</tr>
<tr>
<td scope="row">1</td>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td scope="row">2</td>
<td>February</td>
<td>$80</td>
</tr>
</table>
</body>
</html>

显示效果为：

17.常见的块级元素和行内元素：

块级元素：标题标签<h>、<p>、<div>、<li>、<ul>、<ol>、<dl>、<dt>、<form>、<table>、<td>、<th>、<tr>、<address>、<caption>等；

行内元素：<a>、<img>、<em>、<span>、<strong>、<input>、<q>、<textarea>、<code>、<i>、<br>等；

18.块级元素和行内元素之间的相互转化：

"display：inline"：将元素转为行内元素，不可设置宽高及内外边距，高度就是文子或者图片的宽度，不可以改变，当一行排不下去的时候会换行；

"display：block"：将元素转为块级元素，可以设置宽高及内外边距，独占一行；

"display：inline-block"：将转元素为内联元素，同时拥有inline属性和block属性；（注：只对IE8以上有效，不支持IE6\IE7）

lianglizhongblog

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
这几天的自学总结汇总

1.<body></body>里面的内容是网页显示的内容；2.<hx>标签在<body></body>里面；3.同时设置不同段落的字体大小和颜色：例：让第一个段落和第二个段落的font-size都为16px。请不要为第二个段落添加 class 属性。<style>.color{color:red;}P{font-size:16px;}</style><pclass=“.color”>…</P><p>,,,</p>注：1.“.color”中的“.”不能少； 2.分号“;
复制链接

扫一扫