HTML

最新推荐文章于 2024-07-25 11:26:35 发布

网友小椒

最新推荐文章于 2024-07-25 11:26:35 发布

阅读量195

点赞数

分类专栏： Web 文章标签： html java

本文链接：https://blog.csdn.net/xxxjackboy/article/details/110440932

版权

Web 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

概念

Hyper Text Markup Language 超文本标记语言
是最基础的网页开发语言

超文本：用超链接的方法，将各种不同空间的文字信息组织在一起的网状文本
标记语言：由标签构成的语言<标签名称> 如html，xml
标记语言不是编程语言

快速入门

语法：

html文档后缀名 .html 或者 .htm

标签分类

围堵标签：有开始标签和结束标签如
《html》《/htmt》
自闭和标签：开始标签和结束标签在一起。如《br/》

标签可以嵌套

需要正确嵌套，不能你中有我，我中有你
正确写法《a》《b》《/b》《/a》

在开始标签中可以定义属性。属性由键值对构成，值需要用引号（单双都可以）

html标签不区分大小写

<html>
	<head>
		<title>title</title>
	</head>
	<body>
		<font color='red'>HelloWorld</font><br/>
		<font color ='green'>HelloWorld</font>
	</body>
</html>

标签学习

1️⃣文件标签：构成html最基本的标签

html：html文档的根标签
head：头标签。用于指定html文档的一些属性。引入外部的资源
title：标题标签
body：体标签
!DOCTYPE：html5中定义该文档是html文档
align显示位置：center left right

2️⃣文本标签：和文本有关的标签

注释：《！–注释内容 --》

<!-- 注释 -->
    <!-- br 换行 -->
    白日依山尽，<br />黄河入海流。<br>

<!-- hr显示一条水平线 分割线-->
<hr color="red"width="200"size="10"align="left"/>

<!--段落标签 p -->
    <p>
        11111111111111111111
    </p>


<!--标题标签 h1~h6 自带换行效果-->
    旅游网<br>
    <h1>旅游网</h1>
    <h2>旅游网</h2>
    <h3>旅游网</h3>
    <h4>旅游网</h4>
    <h5>旅游网</h5>
    <h6>旅游网</h6>

属性定义：
color：颜色 1英文单词；2rgb(值1，值2，值3)值的范围0~255；3 #值1值2值3 范围：00~FF之间，如 #FF00FF
size：大小
face：字体
width：1数值：width=‘20’ 数值的单位默认是 px（像素）；2数值%：占比相对于父元素的比例

3️⃣图片标签：展示图片

img：展示图片
属性： src:指定图片的位置大小信息
alt：图标名字
<img src="image/jingxuan_2.jpg"align=“right” alt=“古镇” height=“500”/>

4️⃣列表标签：

有序列表：
ol
li
无序列表
ul
li

    <!--有序列表 ol -->
    早上起床
    <ol type="1"start="5">
        <li>睁眼</li>
        <li>看手机</li>
        <li>穿衣服</li>
        <li>洗漱</li>

    </ol>
    <!-- 无序列表 ul-->
    早上起床
    <ul type="disc">
        <li>睁眼</li>
        <li>看手机</li>
        <li>穿衣服</li>
        <li>洗漱</li>

    </ul>
    早上起床
    <ul type="square">
        <li>睁眼</li>
        <li>看手机</li>
        <li>穿衣服</li>
        <li>洗漱</li>

    </ul>
    早上起床
    <ul type="circle">
        <li>睁眼</li>
        <li>看手机</li>
        <li>穿衣服</li>
        <li>洗漱</li>

    </ul>

5️⃣链接标签：

定义一个超链接
<a href="http://www.baidu.com">点我</a>
属性：
href:指定访问资源的URL（统一资源定位符）
_self:默认值，在当前页面打开
_blank:在空白页打开

点击图片打开链接
<a href="http://www.baidu.com"><img src="image/jingxuan_2.jpg"></a>

块标签

 <!--
    div:每一个div占满一整行。块级标签
    span 文本信息在一行展示 行内标签 内联标签
    -->
    <div>jackboy</div>
     <span>jackboy</span>

6️⃣表格标签：

table：定义表格 width宽度 border：边框 cellpadding：定义内容和单元格的距离cellspacing：定义单元格之间的距离
bgcolor：背景色 align:对齐方式
tr：定义行
td：定义单元格
th：定义表头单元格：居中加粗

<caption>:表格标题
<thead>：表格头部分
<tbody>表格体部分
<tfoot>表格脚部分

⑦语义标签：为了提高程序的可读性
header：页眉 footer：页脚

网友小椒

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
HTML

概念Hyper Text Markup Language 超文本标记语言是最基础的网页开发语言超文本：用超链接的方法，将各种不同空间的文字信息组织在一起的网状文本标记语言：由标签构成的语言<标签名称> 如html，xml标记语言不是编程语言快速入门语法：html文档后缀名 .html 或者 .htm标签分类围堵标签：有开始标签和结束标签如《html》《/htmt》自闭和标签：开始标签和结束标签在一起。如《br/》标签可以嵌套需要正确嵌套，不能你中有我
复制链接

扫一扫

专栏目录