html总结(1)

1 基础 

<html>

<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>

</html>

  • <html> 与 </html> 之间的文本描述网页
  • <body> 与 </body> 之间的文本是可见的页面内容
  • <h1> 与 </h1> 之间的文本被显示为标题
  • <p> 与 </p> 之间的文本被显示为段落

2 页面有个点我的链接.

实际上为<a>press me</a> 应加上属性点到哪里去了

<html>
<body>

<a href="http://www.w3school.com.cn">
点我</a>

</body>
</html>

 

3 页面显示一个图像

<img src="w3school.jpg" width="104" height="142" />

 

4页面浏览器最上方为标题

<h>搜狐-中国最大的门户网站</h>

 

5html的注释

<!-- This is a comment -->

 

6换行显示

<p>This is<br />a para<br />graph with line breaks</p>

 

7插入横线

<p>This is a paragraph</p><hr /><p>This is a paragraph</p>

 

8背景颜色设置

<html><body style="background-color:yellow"><h2 style="background-color:red">This is a heading</h2><p style="background-color:green">This is a paragraph.</p></body></html>

 

9不同字体和大小

<body>

<h1 style="font-family:verdana">A heading</h1>

<p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p>

</body>

 

10居中显示

<body>

<h1 style="text-align:center">This is a heading</h1>

<p>The heading above is aligned to the center of this page.</p>

</body>

 

11 显示点我,同一页面打开

<a href="http://www.w3school.com.cn/">Visit W3School</a>

 

12显示点我,再开开一页面打开

<a href="http://www.w3school.com.cn/" target="_blank">Visit W3School!</a>

 

13

First name:
Last name:


这种样式

<form>First name: <input type="text" name="firstname" /><br />Last name: <input type="text" name="lastname" /></form>

 

14

Male
Female

这种样式

<form><input type="radio" name="sex" value="male" /> Male<br /><input type="radio" name="sex" value="female" /> Female</form>

 

 

15

I have a bike
I have a car

复选框

<form><input type="checkbox" name="bike" />I have a bike<br /><input type="checkbox" name="car" />I have a car</form>

 

16 显示图像,并且图像不能显示时显示一些信息

<img src="....../boat.gif" alt="Big Boat"

 

17背景为图像

<body background="http://www.w3school.com.cn/clouds.gif">

已经废弃,使用css

 

18 颜色

当所有颜色取相等的值时,灰色就可以被显示出来。为了使您更容易地选择合适的灰色,我们为您制作了一幅灰阶色表。

灰色RGBHEX
 RGB(0,0,0)#000000
 RGB(8,8,8)#080808
 RGB(16,16,16)#101010
 RGB(24,24,24)#181818
 RGB(32,32,32)#202020
 RGB(40,40,40)#282828
 RGB(48,48,48)#303030
 RGB(56,56,56)#383838
 RGB(64,64,64)#404040
 RGB(72,72,72)#484848
 RGB(80,80,80)#505050
 RGB(88,88,88)#585858
 RGB(96,96,96)#606060
 RGB(104,104,104)#686868
 RGB(112,112,112)#707070
 RGB(120,120,120)#787878
 RGB(128,128,128)#808080
 RGB(136,136,136)#888888
 RGB(144,144,144)#909090
 RGB(152,152,152)#989898
 RGB(160,160,160)#A0A0A0
 RGB(168,168,168)#A8A8A8
 RGB(176,176,176)#B0B0B0
 RGB(184,184,184)#B8B8B8
 RGB(192,192,192)#C0C0C0
 RGB(200,200,200)#C8C8C8
 RGB(208,208,208)#D0D0D0
 RGB(216,216,216)#D8D8D8
 RGB(224,224,224)#E0E0E0
 RGB(232,232,232)#E8E8E8
 RGB(240,240,240)#F0F0F0
 RGB(248,248,248)#F8F8F8
 RGB(255,255,255)#FFFFFF

 

如需查看基于红色从 0 到 255 变化时的 16384 种不同的颜色,请单击下面的十六进制值或者 rgb 颜色值:

Red LightHEXRGB
 #000000rgb(0,0,0)
 #080000rgb(8,0,0)
 #100000rgb(16,0,0)
 #180000rgb(24,0,0)
 #200000rgb(32,0,0)
 #280000rgb(40,0,0)
 #300000rgb(48,0,0)
 #380000rgb(56,0,0)
 #400000rgb(64,0,0)
 #480000rgb(72,0,0)
 #500000rgb(80,0,0)
 #580000rgb(88,0,0)
 #600000rgb(96,0,0)
 #680000rgb(104,0,0)
 #700000rgb(112,0,0)
 #780000rgb(120,0,0)
 #800000rgb(128,0,0)
 #880000rgb(136,0,0)
 #900000rgb(144,0,0)
 #980000rgb(152,0,0)
 #A00000rgb(160,0,0)
 #A80000rgb(168,0,0)
 #B00000rgb(176,0,0)
 #B80000rgb(184,0,0)
 #C00000rgb(192,0,0)
 #C80000rgb(200,0,0)
 #D00000rgb(208,0,0)
 #D80000rgb(216,0,0)
 #E00000rgb(224,0,0)
 #E80000rgb(232,0,0)
 #F00000rgb(240,0,0)
 #F80000rgb(248,0,0)
 #FF0000rgb(255,0,0)
ColorColor HEXColor RGB
 #000000rgb(0,0,0)
 #FF0000rgb(255,0,0)
 #00FF00rgb(0,255,0)
 #0000FFrgb(0,0,255)
 #FFFF00rgb(255,255,0)
 #00FFFFrgb(0,255,255)
 #FF00FFrgb(255,0,255)
 #C0C0C0rgb(192,192,192)
 #FFFFFFrgb(255,255,255)

 

 

19插入表格,还有序列号

 

<table border="1">
<tr>
  <th>someheader</th>
  <th>someheader</th>
</tr>
<tr>
  <td>sometext</td>
  <td>sometext</td>
</tr>
</table>

 

<ul>
<li>First item</li>
<li>Next item</li>
</ul>

 
 
<ol>
<li>First item</li>
<li>Next item</li>
</ol>
 
 

 

20

This is some text. This is some text. This is some text. This is some text. This is some text.Another text. Another text. Another text. Another text. Another text. Another text. Another text.

 是不带边框的表格table

<table border="0" width="100%" cellpadding="10">
<tr>

<td width="50%" valign="top">
This is some text. This is some text. This is some text. This is some text. This is some text.
</td>

<td width="50%" valign="top">
Another text. Another text. Another text. Another text. Another text. Another text. Another text.
</td>

</tr>
</table>

 

21ubuntu那样页面并行显示

<frameset cols="25%,50%,25%">

  <frame src="/example/html/frame_a.html">
  <frame src="/example/html/frame_b.html">
  <frame src="/example/html/frame_c.html">

</frameset>

 

22竖着显示

<frameset rows="25%,50%,25%">

  <frame src="/example/html/frame_a.html">
  <frame src="/example/html/frame_b.html">
  <frame src="/example/html/frame_c.html">

</frameset>

 

23框架的应用可以做成QT的那种多界面应用

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值