更新一些最开始的自学内容---HTML篇一

中英对照优美语句


第一部分语句


PRC

Distance could make you forget about them, but the memories would always be there.
距离会让你遗忘,但是回忆却会永驻

Everbody will make mistakes, that's why they put erasers on the end of pencils.
每个人都会犯错这就是为什么把橡皮擦安在铅笔后面的原因理由

a2+b2=c2+d4

Don't be so hard on yourself.
别对自己太苛刻了。

If you really love me, then why do I see is to breed.
倘若你真的爱我那么为什么我看到的只是繁衍。

Dream most deep place, only then the smile is not tired.
梦的最深处,只有微笑不累

I never wanted to be your whole life. Just your favorite part.
我从来就没想过要成为你的全部。我只想做你最喜爱的那一个部分。

< 1 > &   However long the night, the dawn will break.
管黑夜有多长,天亮总会到来。

I don't know where I am going, but I am on my way.
我不知将去何方,但我已在路上。

Can't sleep at night. Can't get up in the morning.
晚上睡不着,早上起不来。

Every thing is gonna be alright.
一切都会好起来的。

重庆市南岸区重庆工商大学
000-12345678
 1 <h1 title="一级标题">中英对照优美语句</h1>
 2    <!--这是一级标题-->
 3    
 4    <hr width="50%" align="left" size="2">
 5    <!--水平线 宽 靠左 -->
 6    
 7    <h2 title="二级标题">第一部分语句</h2>
 8    <!--这是二级标题-->
 9    
10    <hr width="35%" align="left" size="0.5">
11    
12    <abbr title="中华人民共和国">PRC</abbr>
13    
14    <p title="第一句">
15    Distance could make you <b>forget</b> about <i>them</i>, but the memories would <wbr>always</wbr> be there.<br>
16    距离会让你<b>遗忘</b>,但是回忆却会<i>永驻</i></p> 
17    <!--这是加粗和斜体的用法-->
18    
19    <p>
20    Everbody will make <tt>mistakes</tt>, that's why they put <tt>erasers</tt> on the end of <wbr>pencils</wbr>.<br>
21    每个人都会<small>犯错</small><small>这就</small>是为什么把<s>橡皮擦</s>安在铅笔后面的<del>原因</del><ins>理由</ins></p>
22    <!--其他字体-->
23    
24    <p title="公式">
25    a<sup>2</sup>+b<sub>2</sub>=c<sub>2</sub>+d<sup>4</sup></p>
26    <!--上标和下标-->
27    
28    <p>
29    Don't be so hard on yourself.<br>
30    别对自己<mark>太苛刻了</mark></p>
31    <!--高亮-->
32    
33    <p>
34    If you really <em>love</em> me, then why do I see is to <strong>breed</strong>.<br>
35    倘若你真的<dfn>爱我</dfn><code>那么</code>为什么<samp>我看到</samp>的只是繁衍。</p> 
36    <!--em强调 strong着重 dfn定义 code代码 samp例子代码 -->
37    
38    <p> 
39    Dream most <kbd>deep place</kbd>, <var>only then</var> the smile is not tired.<br>
40    梦的最深处,只有<cite>微笑不累</cite></p>
41    <!--kbd用户输入 var变量 cite引用    --->
42    
43    <p>
44    I never wanted to be your whole life. Just your favorite part.<br>
45    <bdo>我从来就没想过要成为你的全部</bdo><bdi>我只想做你最喜爱的那一个部分</bdi></p>
46    <!--bdo bdi ??????-->
47    
48    <p>
49    &lt; 1 &gt; &amp; &nbsp; However long the night, the dawn will break.<br>
50    管黑夜有多长,天亮总会到来。</p>
51    
52    <p>
53    I don't know where I am going, but I am on my way.<br>
54    我不知将去何方,但我已在路上。</p>
55    
56    <p>
57    Can't sleep at night. Can't get up in the morning.<br>
58    晚上睡不着,早上起不来。</p>
59    
60    <P>
61    Every thing is gonna be alright.<br>
62    一切都会好起来的。</p>
63    
64    <address>
65    <block quote>
66    重庆市南岸区重庆工商大学</block quote><br> 000-12345678</address>
67    <!--block quote???  address地址 -->
代码 -- 1

我的第一个HTML!

我的第一个段落!


一级标题

二级标题

三级标题

四级标题

五级标题
六级标题

段落

链接到百度

链接到一张图片

换行
换行

居中标题

居中标题


红色背景文字

绿色背景文字

一种字体a heading

另一种字体a heading

 1 <!--<body bgcolor="red">红色背景</body>-->
 2 <!--<body style="background-color:yellow">黄色背景</body>-->
 3   <h1>我的第一个HTML!</h1>
 4   <p>我的第一个段落!</p>
 5   <hr  width="50%" align="left" size="1"/><!--水平线-->
 6   <h1>一级标题</h1>
 7   <h2>二级标题</h2>
 8   <h3>三级标题</h3>
 9   <h4>四级标题</h4>
10   <h5>五级标题</h5>
11   <h6>六级标题</h6>
12   <hr width="700" align="left" size="3"/><!--水平线-->
13   <p>段落</p>
14   
15   <p>链接到<a href="https://www.baidu.com">百度</a></p>
16   
17   <p>链接到一张图片<img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1530245621983&di=ad3bed61f3329e4057421aaa884c0f3d&imgtype=0&src=http%3A%2F%2Fimg.bss.csdn.net%2F201509241723142064.jpg" width="100" height="100"></p>
18   
19   换行<br>
20   换行<br />
21   
22   <h1 align="center">居中标题</h1>
23   <h1 style="text-align:center">居中标题</h1>
24   <hr /><!--水平线-->
25   <p style="background-color:red">红色背景文字</p>
26   <p style="background-color:green">绿色背景文字</p> 
27   
28   <p style="font-family:verdana">一种字体a heading</p>
29   <p style="font-family:arial;color:red;font-size:20px">另一种字体a heading</p>
代码 -- 2

文本格式化

This text is bold


This text is strong


This text is big


This text is emphasized


This text is italic


This text is small
This text containssubscript


This text containssuperscript


  这是
  预格式文本。
  它保留了      空格
  和换行。
  

pre 标签很适合显示计算机代码:

  for i = 1 to 10
     print i
  next i
  

Computer code
Keyboard input
Teletype text

Sample text


Computer variable

注释:这些标签常用于显示计算机/编程代码。


地址
Written by Donald Duck.
Visit us at:
Example.com
Box 564, Disneyland
USA

etc.
www


Here is some Hebrew text顺序颠倒

Here is some Hebrew text


引用

长引用:

ccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccc长引用

短引用: 短引用


删除后插入:

有只小猫小狗

<h1 style="text-align:center;font-size:50px;color:red;background-color:yellow">文本格式化</h1>
  <!--居中,字号,字色,背景颜色-->
  
  <b>This text is bold</b>  <!--这段加粗-->
  <br>
  <strong>This text is strong</strong>  <!--着重-->
  <br>
  <big>This text is big</big>  <!--大号-->
  <br>
  <em>This text is emphasized</em>  <!--强调-->
  <br>
  <i>This text is italic</i>  <!--斜体-->
  <br>
  <small>This text is small</small>
  <br>
  This text contains<sub>subscript</sub>  <!--下标-->
  <br>
  This text contains<sup>superscript</sup>  <!--上标-->
  <br>
  
  <hr width="30%" align="left">
  
  <pre>
  这是
  预格式文本。
  它保留了      空格
  和换行。
  </pre>

  <p>pre 标签很适合显示计算机代码:</p>

  <pre>
  for i = 1 to 10
     print i
  next i
  </pre>
  
  <hr width="30%" align="left">
  
  <code>Computer code</code>
  <br />
  <kbd>Keyboard input</kbd>
  <br />
  <tt>Teletype text</tt>
  <br />
  <samp>Sample text</samp>
  <br />
  <var>Computer variable</var>
  <br />

  <p>
  <b>注释:</b>这些标签常用于显示计算机/编程代码。
  </p>
  
  <hr width="30%" align="left">
  <address>
  地址<br>
  Written by <a href="mailto:webmaster@example.com">Donald Duck</a>.<br> 
  Visit us at:<br>
  Example.com<br>
  Box 564, Disneyland<br>
  USA
  </address>
  
  <hr width="30%" align="left">
  <abbr title="etcetera">etc.</abbr>
  <br />
  <acronym title="world wide web">www</acronym>
  <br />
  <hr width="30%" align="left">
  
  <p>Here is some Hebrew text顺序颠倒</p>
  <bdo dir="rtl">Here is some Hebrew text</bdo>
  <hr width="30%" align="left">
  
  <p>引用</p>
  长引用:
  <blockquote>ccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccc长引用</blockquote>
  短引用:
  <q>短引用</q>
  <hr width="30%" align="left">
  
  删除后插入:
  <p>有只<del>小猫</del><ins>小狗</ins><p>
  <hr width="30%" align="left">
Code -- 3

原文地址:https://www.cnblogs.com/bacydm/p/9762441.html