常用属性:

Width=宽度

Height=高度

Size=大小

Color=颜色

Align=布局方向,值包括(top,bottom,left,right,center)上，下，左，右，中。

Border=边框大小

Title=提示文字

Href=连接路径

Src=资源路径

Bgcolor=背景颜色



常用标签: 

1. <br> 换行标签  

2. <p>  段落标签  

3. <b>粗体显示</b>  

4. <i>斜体显示</i>  

5. <u>删除线</u>  

6. 超连接标签,href=连接地址,Target=是否新建页面打开,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>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

　　　　</tr>

　　　　<tr> 

    <td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

　　　　</tr>

　　　　<tr> 

    <td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

　　　　</tr>

</table>  

11. 表格跨行跨列,此例依旧是三行三列：

第一行的第1列跟第2列合并,colspan=2为跨2列;

第二行第3列跟第三行第3列合并,rowspan=2为向下跨2行;

例:<table width="300" border="1" cellspacing="0" cellpadding="1">

<tr> 

<!--这里的colspan就是向右跨列-->

<td colspan="2">&nbsp;</td>

<td>&nbsp;</td>

</tr>

<tr> 

<td>&nbsp;</td> 

<td>&nbsp;</td> 

<!--这里的rowspan就是向下跨行-->

<td rowspan="2">&nbsp;</td>

</tr>

<tr> 

<td>&nbsp;</td>

<td>&nbsp;</td>

</tr>

</table>  

12. 字体标签，size=字体大小，color=字体颜色

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

 

13. CSS样式，以下代码就是一个定义样式的模版，<style type="text/css">但凡定义的样式都要写在这对标签里面才会生效，而style标签必须在<head>标签里面写。这里定义的Td样式前面是没有加点的，这表示网页内所有td标签都会用此样式， 而且不需要经过class调用.这里自定义了Cs1，注意前面是加点的，那么说明这个样式必须用class调用

例：<style type="text/css"> 

<!--border为边框样式，自带三个属性，颜色、线性、粗细大小--> Td{ border:#0000FF solid 1px;} 

<!--这个样式是针对字体的，跟前面font差不多--> 

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

<!--这里我们对字体调用了Cs1样式--> 

<span class="Cs1">学习编程，美好未来</span> 

<!--这是一行一列的表格，此处没有对class调用样式，但是效果却跟上面Td定义的一样，这说明Td样式前面没有加点，网页凡是<td>的标签将自动引用该样式--> <table> <tr> 

<td>123456</td> </tr> </table>  

14. 内嵌样式定义，简单的样式我们可以通过标签内style属性定义，效果跟13例子一样 例：<span style=" color:#990000; font-size=:18px">红色18号字体</span>  

15. 图片，src=图片路径，width=图片宽度，height=图片高度，高宽不写为默认大小 <!--这里的src为本地电脑image文件下的text.jpg图片--> 

例1：<img src="data:image/text.jpg" width="120" height="80" /> <!--这里的src为网络图片路径-->

HTML初级入门内容的更多相关文章

  1. 响应式Web初级入门

    本文来自我的前端博客,原文地址:http://www.hacke2.cn/about-responsive/ 跨终端时代的到来 当你乘坐各种交通工具(公交.地铁.轻轨.火车)时你会发现,人们都个个低下 ...

  2. Sping AOP初级——入门及简单应用

    在上一篇<关于日志打印的几点建议以及非最佳实践>的末尾提到了日志打印更为高级的一种方式——利用Spring AOP.在打印日志时,通常都会在业务逻辑代码中插入日志打印的语句,这实际上是和业 ...

  3. Spring AOP初级——入门及简单应用

      在上一篇<关于日志打印的几点建议以及非最佳实践>的末尾提到了日志打印更为高级的一种方式——利用Spring AOP.在打印日志时,通常都会在业务逻辑代码中插入日志打印的语句,这实际上是 ...

  4. hadoop入门手册5：Hadoop【2.7.1】初级入门之命令：文件系统shell2

    问题导读 1.改变hdfs文件的权限,需要修改哪个配置文件?2.获取一个文件的或则目录的权限,哪个命令可以实现?3.哪个命令可以实现设置访问控制列表(ACL)的文件和目录? 接上篇:Hadoop[2. ...

  5. hadoop入门手册4：Hadoop【2.7.1】初级入门之命令：文件系统shell1

    问题导读1.Hadoop文件系统shell与Linux shell有哪些相似之处?2.如何改变文件所属组?3.如何改变hdfs的文件权限?4.如何查找hdfs文件,并且不区分大小写? 概述文件系统 ( ...

  6. hadoop入门手册3：Hadoop【2.7.1】初级入门之命令指南

    问题导读1.hadoop daemonlog管理员命令的作用是什么?2.hadoop如何运行一个类,如何运行一个jar包?3.hadoop archive的作用是什么? 概述 hadoop命令被bin ...

  7. Spring Cloud实战之初级入门（四）— 利用Hystrix实现服务熔断与服务监控

    目录 1.环境介绍 2.服务监控 2.1 加入依赖 2.2 修改配置文件 2.3 修改启动文件 2.4 监控服务 2.5 小结 3. 利用hystrix实现消费服务熔断 3.1 加入服务熔断 3.2 ...

  8. SpringCloud实战之初级入门（三）— spring cloud config搭建git配置中心

    目录 1.环境介绍 2.配置中心 2.1 创建工程 2.2 修改配置文件 2.3 在github中加入配置文件 2.3 修改启动文件 3. 访问配置中心 1.环境介绍 上一篇文章中,我们介绍了如何利用 ...

  9. mui初级入门教程（六）— 模板页面实现原理及多端适配指南

    文章来源:小青年原创发布时间:2016-07-26关键词:mui,webview,template,os,多端适配转载需标注本文原始地址: http://zhaomenghuan.github.io. ...

随机推荐

  1. Swift 提示：Initialization of variable was never used consider replacing with assignment to _ or removing it

    Swift 提示:Initialization of variable was never used consider replacing with assignment to _ or removi ...

  2. pypy的virtualenv安装mysql的问题解决

    pypy安装mysql 构建基于pypy的virtualenv pip install virtualenv pip install pypy virtualenv --no-site-package ...

  3. 算法系列：寻找最大的 K 个数

    Copyright © 1900-2016, NORYES, All Rights Reserved. http://www.cnblogs.com/noryes/ 欢迎转载,请保留此版权声明. -- ...

  4. PLSQL数据库操作（excel）

    一.plsql数据库操作: 删除数据前备份一张表: create table plat_counter_def_bf as select * from plat_monitor_counter_def ...

  5. 【chrome插件】web版微信接入图灵机器人API实现自动回复

    小贱鸡自动回复API已经不可以用了,现在改良接入图灵机器人API 360chrome浏览器团队翻译了部分谷歌插件开发文档 地址:http://open.chrome.360.cn/extension_ ...

  6. 转--脉络清晰的BP神经网络讲解，赞

    http://www.cnblogs.com/wengzilin/archive/2013/04/24/3041019.html 学 习是神经网络一种最重要也最令人注目的特点.在神经网络的发展进程中, ...

  7. Log4j2 - 配置

    官方文档:http://logging.apache.org/log4j/2.x/index.html 1 概述 Log4j2的配置包含四种方式,其中3种都是在程序中直接调用Log4j2的方法进行配置 ...

  8. gcc命令中参数c和o混合使用的详解[转载]

    gcc -c a.c  编译成目标文件a.o gcc -o a a.o  生成执行文件a.exe gcc a.c  生成执行文件a.exe gcc -o a -c a.c    编译成目标文件a gc ...

  9. 服务器&浏览器伪装的故事

    今天要说的是伪装,为嘛要伪装呢?我想,首先是心虚,不够自信,比如你安全措施做的不够,你怕别人黑你的系统,所以就要伪装.其次呢,我想就是有不可告人的秘密了,比如你有竞争对手总是找你的茬,拦截你,那咋办呢 ...

  10. dedecms在列表或首页取得文章首图的功能改进

    在网上找过资料,效果不是很满意,第一个是原理说的不对,第二个是后缀写死. 原文大致如下: 当文章缩略图是自动选取文章内第一个图片裁减所得时 他的命名规则是有规律的 比如原文是1.jpg 它对应的缩略图 ...