html笔记

最新推荐文章于 2024-08-13 20:49:47 发布

我不是老白干

最新推荐文章于 2024-08-13 20:49:47 发布

阅读量199

点赞数 1

分类专栏：前端文章标签： html java html5

本文链接：https://blog.csdn.net/qdkgood/article/details/115796966

版权

前端专栏收录该内容

1 篇文章 0 订阅

订阅专栏

HTML5

1.什么是html（超文本标记语言）

W3C(万维网联盟)标准：

结构化标准语言（HTML、XML）
表现标准语言（CSS）
行为标准（DOM、ECMAScript）

2.网页基本信息

2.1DOCTYPE声明

2.2title标签

2.3meta标签

<!--DOCTYPE：告诉浏览器使用什么规范-->

<!DOCTYPE html>
<html lang="en">
<!--head标签代表网页头部-->
<head>
<!--    meta描述性标签-->
<!--    meta一般用来做SEO-->
    <meta charset="UTF-8">
    <meta name="keywords" content="java学习，html学习">
    <meta name="description" content="dk的Java学习">
<!--    title网页标题-->
    <title>我的第一个网页</title>
</head>
<!--body代表网页的主体-->
<body>
hello world!!
</body>
</html>

3.网页的基本标签

3.1标题标签

3.2段落标签

3.3换行标签

3.4水平线标签

3.5字体样式标签

3.6注解和特殊符号

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基本标签</title>
</head>
<body>

<!--标题标签-->
<h1>一级标签</h1>
<h2>二级标签</h2>

<!--段落标签-->
<p>两只老虎，两只老虎</p>
<p>跑得快，跑得快</p>
<p>一只没有尾巴，一只没有耳朵</p>
<p>真奇怪，真奇怪</p>

<!--换行标签-->
两只老虎，两只老虎<br>两只老虎，两只老虎

<!--水平线标签-->
<hr>

<!--粗体、斜体-->
<strong>i love you</strong><br>
<em>i love you</em><br>

<!--特殊符号(空格大于小于)-->
空&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;格
<br>
&gt;
<br>
&lt;
&copy;版权所有
</body>
</html>

4.图像标签

图像标签

5.链接标签

锚链接
<a name="top">头部</a>
<a href="#top">回到顶部</a>

6.块元素和行内元素

7.列表标签

 <p>
           <p class="list"> 4.1无序列表</p>
            <ul>
                <li>列表1</li>
                <li>列表2</li>
            </ul>
            <p class="list"> 4.2有序列表</p>
           
            <ol>
                <li>列表1</li>
                <li>列表2</li>
            </ol>
            <p class="list"> 4.3定义列表</p>
           
            <dl>
                <dt>列表1</dt>
                <dd>内容</dd>
                <dt>列表2</dt>
                <dd>内容</dd>
            </dl>
        </p>

8.表格标签

<!--border代表边框-->
<table border="1">
    <tr>
        <td>row 1, cell 1</td>
        <td>row 1, cell 2</td>
    </tr>
    <tr>
        <td>row 2, cell 1</td>
        <td>row 2, cell 2</td>
    </tr>
</table>table>

9.媒体元素

controls:定义是否使用播放控件（控件有声音大小、停止播放等按钮）

poster：封面

<p>
        <audio src="" controls></audio>
        <video src="" controls poster="img/ironman.jpg"></video>
</p>

10.页面结构分析

页面结构

11.iframe内联框架

12.表单

get：可以在url中看到提交的信息、不安全

post：安全、可以传输大文件
html表单

html表单属性

单选框中name标志组

图片按钮有自动提交功能

13.下拉框

<form action="https://me.csdn.net/weixin_45609811" method="post">
	下面是简单的下拉菜单<br />
		<select id="skills" name="skills">
			<option value="luo">海螺</option>
			<option value="ke">贝壳</option>
			<option value="pang">螃蟹</option>
		</select><br/><br/><br/><br/>
	下面是允许多选的列边框:<br/>
		<select id="books" name="books" multiple size="4">
			<option value="luo">海螺</option>
			<option value="ke">贝壳</option>
			<option value="pang">螃蟹</option>

		</select><br />
		下面是允许多选的列边框：<br />
		<select id="lee" name="lee" multiple size="6">
			<optgroup label="海洋"  >
				<option value="luo" disabled>海螺</option>
			<option value="ke">贝壳</option>
			<option value="pang" selected>螃蟹</option>
			</optgroup>

			<optgroup label="陆地">
				<option value="fol">小花</option>
				<option value="gla">小草</option>
			</optgroup>

		</select><br />
		<button type="submit" >提交</button><br>
	</form>

14.文件域type=“file”

15.滑块

16.搜索框

17.表单应用

隐藏hidden
只读readonly
禁用dis。。。。

18.表单验证

placeholder：提示信息、如：请输入用户名

required：非空判断

pattern：正则表达式

我不是老白干

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
html笔记

HTML51.什么是html（超文本标记语言）W3C(万维网联盟)标准：结构化标准语言（HTML、XML）表现标准语言（CSS）行为标准（DOM、ECMAScript）2.网页基本信息2.1DOCTYPE声明2.2标签2.3标签<!DOCTYPE html><html lang="en"><head><!-- m
复制链接

扫一扫

专栏目录