常用属性:

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. VS2010+C#+EmguCV 配置详解

    在VS2010(VC10)中配置能使用C#开发语言调用Open CV视觉库的方法如下.众所周知,能供C#使用的OpenCV库叫:Emgu CV.注意用C#开发的话,是不需要单独安装OpenCV的,em ...

  2. CentOS7安装Oracle 11gR2 安装

    概述 Oracle 在Linux和window上的安装不太一样,公司又是Linux系统上的Oracle,实在没辙,研究下Linux下Oracle的使用,oracle默认不支持CentOS系统安装,所以 ...

  3. [BI项目记]-DB脚本同步

    BI项目中会有很多不同种类的项目,其中比较比较大的一部分就是对DB脚本的处理.然而DB的脚本毕竟无法在项目中进行维护,所以这里介绍如何对DB的脚本进行版本上的维护. 数据库脚本本身没有项目模板支持,很 ...

  4. [译]:Orchard入门——构建你的第一个Orchard网站

    原文链接:Building Your First Orchard Site 文章内容基于Orchard 1.8版本 本文将逐步简要介绍Orchard提供的功能.如果你是第一次使用Orchard,本文将 ...

  5. webbench之编译安装(一)

    1.编译安装:   1 2 3 4 [root@hexuweb102 ~]$wget http://blog.s135.com/soft/linux/webbench/webbench-1.5.tar ...

  6. cookie编码乱码问题与cookie禁用后session操作

    Cookie传输的值只能是ASCII码,该编码表相对老旧不含有很多符号与文字 特别是中文,所以在cookie传值过程中需要先转成相应的ASCII编码再解析 如下 URLEncoder.encode(& ...

  7. 区间dp总结篇

    前言:这两天没有写什么题目,把前两周做的有些意思的背包题和最长递增.公共子序列写了个总结.反过去写总结,总能让自己有一番收获......就区间dp来说,一开始我完全不明白它是怎么应用的,甚至于看解题报 ...

  8. TEST===>Sqlserver中获取年月日时分秒

    可以用两种方法获取 1. select GETDATE() as '当前日期', DateName(year,GetDate()) as '年', DateName(month,GetDate()) ...

  9. Linux 下 JAVA 安装及配置

    1. 要 安装JDK7,当然是要有JDK的二进制文件拉..这个简单,直接在ORACLE的官网中下载就可以拉 http://www.oracle.com/technetwork/java/javase/ ...

  10. odoo 人力资源工资计算拓展

    默认情况下 odoo工资条的计算只支持一下几种python变量: # payslip: object containing the payslips# employee: hr.employee ob ...