HTML基础

目录

概念:

基本语法:

基本标签:

1.文件标签

 2.文本标签

3.图片标签

4.列表标签

5.链接标签

6.块标签


概念:

HTML(Hyber Markup Language 超文本标记语言)是最基础的网页开发语言。

超文本:是运用超链接的方法,将各种不同空间的文字信息组织在一起的网状文本。

标记语言:由标签构成的语言。

基本语法:

1.html文档后缀名为.html或者.htm。

2.标签分为
(1) 围堵标签:有开始标签和结束标签。如<html> </html>
(2)自闭和标签:开始标签和结束标签在一起。如<br>(换行标签)
3.标签可以嵌套:

注意:需要正确嵌套,不能“你中有我,我中有你”

正确:<a><b></b></a>

错误:<a><b></a></b>

4. 在开始标签中可以定义属性。属性是由键值对构成,值需要用引号(单双都可)引起来。
5. html的标签不区分大小写,但是建议使用小写。

基本标签:

1.文件标签

文件标签是构成heml最基本的标签。

<html>:html文档的根标签。

<head>:头标签。用于指定html文档的一些属性,引入外部资源。

<title>:标题标签。

<body>:体标签。

<!DOCTYPE html>:htm1 5中定义该文档是html文档。

这些在idea中创建html5文档后会自动生成。

运行结果如下:

 2.文本标签

<!--注释内容-->:用来做注释用

<h1>to<h6>:标题标签;h1~h6字体大小逐渐变小。

<p>:段落标签

<br>:换行标签 注意:该标签为自闭和标签,写的时候只用写<br>或者<br/>即可

<hr>:展示一条水平线

属性:

color :颜色
width:宽度
size :高度
align :对齐方式
     center:居中
     left :左对齐
     right:右对齐

<b>:字体加粗
<i>:字体斜体
<center>:  文本居中
<font>:字体标签
属性:
color:颜色
size :大小
face:字体

属性说明:

1.color取值方式有以下三种:

(1) 英文单词:red,green,blue
(2).rgb(值1,值2,值3):值的范围:0~255
如rgb(0,0,255)
(3)#值1值2值:值的范围:00~FF之间。如:#FF00FF(可运用取色器来确定多种颜色HTML 取色器/拾色器 | 菜鸟教程

2.width :
(1)数值:width=‘20’ 数值的单位,默认是 px(像素)
(2)数值%:占比相对于父元素的比例 

结果如下: 

3.图片标签

<img src= image/ bear.jpg” align="right”alt=“熊” width="500” height=“500”/>
属性说明:
src:图片地址(在一个项目的目录下新建一个文件夹(我的叫image),里面放图片)

src的书写格式:

以.开头的路径
./:代表当前目录(默认值,可以不写.)
<img src="./image/bear.jpg">
../:代表上一级目录

align:对齐方式
alt:图片显示失败后网页显示内容

4.列表标签

<ol>:有序列表
属性: type(1(默认值),a,A,i (表示小写罗马数字编号)I( 表示大写罗马数字编号)),start:表示从某个值开始
<li>:表中元素
<ul>:无序列表
属性: type(disc square circle)
规定列表的项目符号类型
<li>:表中元素

                        

5.链接标签

<a>:定义一个超链接
属性:
href:跳转到的页面(可以使一个网站的网址)

 <a href="http://www.baidu.com">点击</a><br>
 <a href="http://www.baidu.com"><img src="/image/bear.jpg"> </a>
 <!--点击图片跳转到百度搜索界面-->

target:打开资源方式
(_self:默认值,当前页面打开
_blank:在新页面打开)

6.块标签

<div>:每个div占满一行,自动换行。
<span>:文本信息展示在一行。


 

   本人第一次写博客,是受到同学的启发,如果有什么不好的地方希望大家多多批评指正,谢谢大家!


 


 

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值