HTML网页

最新推荐文章于 2024-07-25 11:26:35 发布
最新推荐文章于 2024-07-25 11:26:35 发布
阅读量112 收藏
点赞数
文章标签： html 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Splitss/article/details/120926604
版权

html

内联框架

<iframe src="" name="点我" frameborder="0" width="1000px" height="800px"></iframe>
<a href="表格.html" target="_blank">点击跳转</a>

列表

有序列表

<ol>
    <li></li>
    <li></li>
</ol>

无序列表

<ul>
</ul>

自定义列表

<dl>
    <dt>列表名称</dt>
    <dd>列表内容</dd>>
</dl>

图像标签

<img src="../html/image/1.jpg" alt="" width="100px" height="100">

基本标签

<h1>一级标签</h1>
<h2>二级标签</h2>
<p>段落标签</p>
<br>换行标签</br>

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

<strong>粗体</strong>
<em>斜体</em>

特殊符号

  空格

>大于号

< 小于号

&copy 版权符号

谋体元素

<!--controls 进度控制
autplay 自动播放-->
<video src="../" controls autoplay/>
<audio src="../" controls/>

表单

action 表单提交的位置
method：post get 提交方式
get 我们可以看见提交的信息，高效，但不安全
post ：比较安全，传输大文件
value 默认初始值
maxlength 最长能写几个字符
size 文本框长度
checked默认选择
readonly只读
disabled 禁用
hidden 隐藏
placeholder 提示信息
required 不能为空
pattern 正则表达式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
</head>
<body>
<h1>注册</h1>
<form action="html1.html" method="get">
<!--    文本输入框-->
    <p>名字: <input type="text" name="username" placeholder="请输入姓名" maxlength="8"  required></p>
<!--    密码输入框-->
    <p>密码: <input type="password" name="userpassword" hidden></p>

<!--    单选框-->
    <p>性别
        <input type="radio"value="boy" name="sex" checked disabled>男
        <input type="radio" value="girl" name="sex">女
    </p>
<!--    多选框-->
    <p>
        爱好
        <input type="checkbox" value="sleep" name="hobby">睡觉
        <input type="checkbox" value="eat" name="hobby">吃
        <input type="checkbox" value="play" name="hobby">玩
        <input type="checkbox" value="basketball" name="hobby">篮球
    </p>
<!--   按钮 -->
    <p>
        <input type="button" name="btn1" value="点击变帅">
    </p>
    <p>
        <input type="image" src="../">
    </p>

<!--    下拉框，列表框-->
    <p>
        下拉框：
        <select name="列表名称">
         <option value="选项的值" >中国</option>
            <option value="选项的值">美国</option>
            <option value="选项的值">印度</option>
            <option value="选项的值" selected>英国</option>


        </select>
    </p>
<!--    文本域-->
    <p>
        反馈
        <textarea name="textarea" cols="50" rows="10">文本内容</textarea>
    </p>
<!--    文件域-->
    <p>
        <input type="file" name="files">
        <input type="button" value="上传" name="upload">
    </p>

<!--    邮件验证-->
    <p>
        邮箱
        <input type="email" name="emall">
    </p>
<!--    url-->
    <p>url
        <input type="url" name="url">
    </p>
<!--    数字验证-->
    <p>
        数字
        <input type="number" name="num" max="100" step="10">
    </p>

<!--    滑块-->
    <p>
        滑块
        <input type="range"  name="" min="0" max="100">
    </p>
<!--    搜索框-->
    <p>
        搜索
        <input type="search" name="search">
    </p>

<!--    增强鼠标可用性-->
    <p><label for="mark">你点我试试</label>
        <input type="text" id="mark">
    </p>

    <p>
    <input type="submit">
    <input type="reset">
    </p>

</form>
</body>
</html>

表格

跨列：colspan
跨行：rowspan
行：tr
列：td

    <tr><td colspan="1">1-1</td>行tr
        列td
    </tr>

链接

target:表示窗口在哪里打开
blank 在新标签里打开
-self 在自己页面打开

锚链接

1.需要一个标记
2.跳转到标记

<p><a name="top">顶部</a></p>
<p><a href="heml3.html">点击我跳转</a></p>
<a href="http://www.baidu.com">百度</a>
<a href=""></a>
<p></p>
<a href="#top">回到顶部</a>

网页结构

header 网页头部

section 网页主体

footer 网页脚部

网页头部

网页主体

网页脚部

Splitss
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
markdown-split:Markdown的扩展，可将内容拆分为版块页面
05-11
降价分割 在以§字符标记的部分中分割Markdown文件（或任何类型的纯文本文件）。 安装 npm install markdown-split 用法 let split = require ( 'markdown-split' ) ; let content = ` § First section Content of the first section. § Second section Content of the second section. ` ; let sections = split ( content ) ; console . log ( sections ) ; 这将产生以下输出： [ { name : 'First section' , content : 'Content of the first section' } , { name :
制作一个简单HTML个人网页网页（HTML+CSS）
热门推荐
weixin_46153254的博客
12-04 35万+
制作一个简单的HTML个人网页
【方法】HTML网页调用本地Python程序
crazyang的博客
05-07 18万+
代码已上传github 首先声明，在HTML中调用本地Python程序是十分不推荐的，一是因为网页调用本地程序的权限正在被取消，二是因为真不如JS写直接，三是只能在自己本地调用。 但如果你要用，像我一样，需要在课堂上进行一个Python代码的展示，并且想要一个好看的UI界面的话，可以这样来做，做起来还是很容易的，但这样的展示仅限于需要弹框的，比如我的人脸检测是弹窗式，如果需要内嵌在网页内...
一个简单的HTML网页
weixin_46153254的博客
12-24 2万+
HTML前端网页，一个介绍景区的网页
html网页设计小作业(个人主页)
m0_53415522的博客
11-08 6万+
简易的个人网页小作业，只用了html+css 布局制作，没啥好说的，直接上图！！！
HTML网页设计制作大作业（div+css）
IT_A_bin的博客
11-25 10万+
话不多说，直接上效果图： 历史介绍 行政区划： 地理环境 著名景点： 美食小吃 工艺品 联系我们 部分项目结构 老师要求的十几个页面20几张图片以及一些跳转，使用div+css布局也基本上都有了。然后代码也有注释。也能够容易看得懂 部分代码 偷个懒，就用notepad打开。不用H-build打开了。哈哈哈 另外有同学要是需要源码的话可以联系我呀。 大家加油！奥利给！ ...............
简单HTML网页制作 实例
xiaoxiaoxiexies的博客
04-25 2万+
HTML网页制作 1.新建文本文档，以“html”结尾。 2.用html网页逻辑器打开，这里我们用Sublime Text打开。 在标签<body></body>里写文本,<h1></h1>意思是把文本设置为标题， align里设置文本居中属性。 html基本结构 <html></html> 段落标签 <p></p> 用来分段用的 空格标签 &nbsp 有几个空格就写几个 &nbsp 标题标签
html网页简单代码
qq_69064369的博客
05-08 1万+
html
HTML网页设计：四、超链接
xfjssaw的博客
03-22 1万+
超链接 1.锚链接 2.功能性链接 邮箱 QQ
html网页设计模板
菜鸟小灰灰的博客
04-26 2万+
https://webframe.xyz/
纯HTML网页源码
11-02
"纯HTML网页源码"指的是只包含HTML代码，不依赖其他如JavaScript、CSS或服务器端脚本的网页。这种网页在本地计算机上直接打开，浏览器会解析HTML源码并呈现网页内容。 纯HTML网页的优势在于简洁、轻量级，易于理解...
静态html网页模板12
02-23
前端 html 静态网页模板 大学生web学习可用
html网页设计大作业
01-04
HTML网页设计是构建互联网内容的基础，它是一种标记语言，用于定义网页的结构和内容。在这个“html网页设计大作业”中，我们关注的重点是植物相关的主题，这表明学习者可能在创建一个关于植物的网站，旨在展示信息或...
静态html网页 代码
12-23
在这个压缩包中，包含的是一些静态HTML网页的代码，这意味着我们可以直接打开这些文件来查看和运行它们，无需服务器支持。 在HTML网页中，主要由一系列的标签组成，这些标签定义了网页的各个部分。例如，`<html>`...
王力宏明星网页制作 HTML网页成品 学生网页制作源码
05-13
【王力宏明星网页制作 HTML网页成品 学生网页制作源码】 在互联网时代，创建一个个人网页成为了展示自我、分享信息的重要手段。对于学生来说，掌握HTML网页制作技术不仅能够提升自己的数字素养，还能为未来的职业...
html网页如何编辑,简单html网页的快速编辑方法
weixin_29731583的博客
06-15 7881
简单html网页的快速编辑方法现在互联网上大多数网页都是由html编写的，html网页还算是比较简单上手的，我们用html配合css布局和javascript特效就可以做成各种各样的精致漂亮网页。下面小编就用txt文本来教大家编辑一个简单的html网页。具体操作步骤如下：1. 首先在桌面上新建一个快捷文本文档(后缀名为.txt)，(这里我们就重命名为网页)2. 打开刚刚新建的文本文档，开始编辑ht...
基于 HTML+ECharts 实现的大数据可视化平台模板（含源码）
柯晓楠
07-24 3309
大数据的可视化对于企业决策、市场分析和业务洞察至关重要。通过直观的数据展示，团队可以快速理解复杂的数据模式，发现潜在的业务机会。本文将详细介绍如何利用 HTML 和 ECharts 实现一个功能丰富的大数据可视化平台模板。
html实现酷炫美观的可视化大屏(十种风格示例，附源码)
最新发布
xcLeigh
07-25 2088
html实现酷炫美观的可视化大屏(十种风格示例，附源码)，大屏源码，可视化大屏模板源码，html可视化大屏源码下载，内含十种不同风格的大屏可视化代码，详细的讲解，酷炫的线条，美观的设计，让图文图表结合的更融洽。兼容各种大屏，调整页面到合适的分辨率，F12全屏观看。各种风格都有，代码上手简单，代码独立，可以直接使用。也可直接预览效果。
【HTML — 构建网络】HTML 入门
07-24 1235
如果您查看许多其他站点的代码，您可能会遇到许多奇怪的标记样式，包括不带引号的属性值。在这一点上，你应该了解 HTML 是什么样子的，以及它在基本层面上是如何工作的。在 HTML 中，不需要在 void 元素标记的末尾添加 a，例如： .但是，它也是一种有效的语法，当您希望 HTML 是有效的 XML 时，您可以这样做。现在，您可以在 Web 浏览器中打开此文件，以查看呈现的代码的外观。在本练习中，您可以如前所述在计算机上本地编辑代码，也可以在下面的示例窗口中编辑代码（在本例中，可编辑示例窗口仅表示。
HTML网页设计入门教程
"HTML网页设计" HTML（HyperText Markup Language）是一种用于创建网页的标准标记语言。它允许网页开发者通过一系列预定义的标签来组织内容，添加样式，以及与用户交互。以下是对HTML网页设计的一些核心知识点的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值