HTML简单入门内容

时间 2020-01-28

标签 html 简单入门内容栏目 HTML 繁體版

原文原文链接

经常使用属性:
Width=宽度
Height=高度
Size=大小
Color=颜色
Align=布局方向,值包括(top,bottom,left,right,center)上，下，左，右，中。
Border=边框大小
Title=提示文字
Href=链接路径
Src=资源路径
Bgcolor=背景颜色 php

经常使用标签:
1.
换行标签
2. <p>  段落标签
3. 粗体显示
4. 斜体显示
5. <u>删除线</u>
6. 超链接标签,href=链接地址,Target=是否新建页面打开,title=提示文字
例:<a href="http://www.baidu.com" Target="_blank" title="链接百度">百度
7. 滚动标签,scrollamount=滚动速度,align=滚动方向,值包括(top,bottom,left,right,)上下左右
例:<marquee scrollamount="20" align="left">公告通知:开始正式运营</marquee>
8. 水平线标签,size=线条粗细,color=线条颜色,width=100%:表示浏览器满屏显
示,100px:表示浏览器100个像素显示
例:<hr size="1" color="red"  width="100%"/>

9. body标签有且只能有一对,此标签属性一改,整个页面都会改变.bgcolor=背景颜
色,background=背景图片
例:<body bgcolor="#990000" background="123.jpg">
10. 表格标签,如下表格为三行三列,table表格标签,tr行标签,td列标签,这些标签都是成对出现的,有开始就必须有结束.border=表格边框大小,cellspacing=表格间距大小,cellpadding=表格填充大小
例:<table width="300" border="1" cellspacing="0" cellpadding="0">
　　　　<tr>
    <td> </td>
<td> </td>
<td> </td>
　　　　</tr>
　　　　<tr>
    <td> </td>
<td> </td>
<td> </td>
　　　　</tr>
　　　　<tr>
    <td> </td>
<td> </td>
<td> </td>
　　　　</tr>
</table>
11. 表格跨行跨列,此例依旧是三行三列：
第一行的第1列跟第2列合并,colspan=2为跨2列;
第二行第3列跟第三行第3列合并,rowspan=2为向下跨2行;
例:<table width="300" border="1" cellspacing="0" cellpadding="1">
<tr>

<td colspan="2"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>

<td rowspan="2"> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
12. 字体标签，size=字体大小，color=字体颜色 css

例：<font size="+2" color="#990000">红色5号字体</font>

13. CSS样式，如下代码就是一个定义样式的模版，<style type="text/css">但凡定义的样式都要写在这对标签里面才会生效，而style标签必须在<head>标签里面写。这里定义的Td样式前面是没有加点的，这表示网页内全部td标签都会用此样式，并且不须要通过class调用.这里自定义了Cs1，注意前面是加点的，那么说明这个样式必须用class调用
例：<style type="text/css">
 Td{ border:#0000FF solid 1px;}

.Cs1{ font-size:14px; font-family:"宋体"; color:#FF0000} </srtpe>

<span class="Cs1">学习编程，美好将来</span>
 <table> <tr>
<td>123456</td> </tr> </table>
14. 内嵌样式定义，简单的样式咱们能够经过标签内style属性定义，效果跟13例子同样例：<span style=" color:#990000; font-size=:18px">红色18号字体</span>
15. 图片，src=图片路径，width=图片宽度，height=图片高度，高宽不写为默认大小 
例1：<img src="image/text.jpg" width="120" height="80" /> 
例2：<img src="http://www.baidu.com/img/baidu_sylogo1.gif" />
转载于猿2048:➧《HTML简单入门内容》编程

1. HTML简单入门
2. HTML --- 简单入门
3. HTML初级入门内容
4. HTML简单入门(一)
5. html与css简单入门
6. html 表单input录入内容校验
7. 简单介绍HTML的入门
8. OSI简单内容
9. HTML极简入门学习
10. HTML学习（二）Echarts入门——html实现简单echarts图例
更多相关文章...
• Memcached入门教程 - NoSQL教程
• Eclipse 内容辅助 - Eclipse 教程
• YAML 入门教程
• Java Agent入门实战（一）-Instrumentation介绍与使用