前端学习:HTML的学习总结

html简介

1 html是什么:超文本标记语言

  • 超文本:文字/图片/音频/视频
  • 标签/标记:<body></body>
  • 怎么做:使用标签来创建网页

2 HTML的用途:是用来编写静态网页的。

  • 搭建整个网页。(框架)CSS用来装修。。。

3 html结构

1 <html>
2     <head>
3     包括资讯信息:整个页面的属性、指导浏览器解析的标签、引入外部文件的标签
4     </head>
5     <body>
6         我们需要展示的信息
7     </body>
8 </html>    

4 区分正斜杠和反斜杠

  • / 正斜杠
  • \ 反斜杠(下坡)

5 开始标签和结束标签

1 <html>(开始标签) 
2     关键字
3 </html>(结束标签)

6 书写规范

  • PS:标签之间嵌套出现
  • 标签之间的层次关系要规范
  • 大部分标签都具有属性 属性="属性"
  • html不区分大小写:建议小写
  • 命名的时候尽量使用英文来编写
  • 注释:要有写注释的意识 <!-- -->

html的标签

html:根标签

head:

<head>
    //设置整个网页的编码格式
    <meta charset = "UTF-8">
    //设置网页标题
    <title> 菜鸟-传奇</title>
</head

body:

1 <body >
2 text:文本的颜色
3 bgcolor:背景色
4 background:背景图片
5 
6 <body text="#00ff00" bgcolor="#00" backgroud="">

//在html代码中,无论有多少个空格,浏览器解析后都认为只有一个空格

空格:&nbsp

//换行

<br>//可以单独存在

//段落标签 单独成一行

<p> 
//xxxx
</p>

//水平线

<hr width:“长度 ”//100px--50%-->
width:长度 //100px--50%--
size:粗度
color:颜色
align:对齐方式 

1 文字标签

<font>文字标签
color:颜色
size:粗度
face:字体的类型


<h1><h6>标签 //标题字体的大小

//字体的加粗
<b > 
<strong>

2 清单/列表的标签

无序列表:
<ul //type改变前面的圆点样式> 
<li>
xxxxxxx
</li>
<li>
xxxxxxx
</li>
</ul>


有序列表:
<ol //type改变前面的排序样式
// 1 A I 。。。
//start="2"从那个数字开始> 
<li>
xxxxxxx
</li>
<li>
xxxxxxx
</li>
</ol>

 

3 图形标签

//src:图形的地址
<img src="img/tp.jpg"/ >
width:宽度
height:高度
border:边框
align:对齐方式(top。。。。)
alt:图片描述//加载文件丢失才出现

4 链接标签

<a> //属性
href="跳转"

5 表格标签

table

 6 块级标签

<div> <p><table>
块级标签:不允许其他元素并排

行级标签:span:允许其他元素并排 设置样式是可以的,但是设置的高度和宽度是无效的

</body >

 

转载于:https://www.cnblogs.com/cainiao-chuanqi/p/11529724.html

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值