简单的网页制作

1网页编写格式

<!DOCTYPE html> 
<html><head><meta charset="utf-8"> <title>中文测试。。。。</title></head><body>这里是测试body测试内容。。。</body>
</html>

2标签

在body内
<h1></h1>双标签 标题 ,加粗,换行  1-6 ---》小
<p></p> 双标签  段落,有换行功效
<hr> 单标签  左到右分割符
<!--    -->注释

3元素属性

给元素提供更多的属性,大部分的元素属性

3.1语法

<标签 属性1=参数1>
1)align left,right,center
2) bgcolor ,body的属性设置网页的背景色
<body bgcolor="0x00ff1234">

4文本元素属性
b 元素 内容 加粗
br 换行
如果是p标签中间有间隔
i元素, 字体倾斜
del元素 删除文字
strong 强调一段文字,效果类似 b标签
u元素,下划线
small元素, 超小字体
sub 下标
sup 上标

h20

100m2
ruby,拼音,二姐 (er) (jie),可能部分浏览器不支持。
make 元素 加黄色背景

5超链接
5种形式
1,链接外部网站
2,链接本地文件
3,图片链接
4,电子邮件链接打开电子邮件
,下载文件链接

	<a href="http://www.baidu.com">baidu</a><br><a href="1.html">1111</a><br><a href="1.html"><img src="abc.jpg"></a><br><a href="mailto:123@13.com">contract me</a><br><a href="abc.jpg">下载</a>

上面的方法在打开新网页时,老的网页会关闭
target 属性
_self :当前位置打开 默认值
_blank 新窗口中打开
baidu

6 img 单标签
src 图像来源
alt 如果不能正确打开,显示的文字
width, heigh
美女 px
美女
百分比是相对于网页而言的, 高度百分比无效的

7列表
有序列,无需序列
自定义列表
无序列表 前面无数字

  • 列表1
  • 列表2
  • 列表3
  • 列表4
有个type属性 文字最前面的符号 disc 黑色实心圆 circle 白色空心圆 square 黑色方块 有序列,前面有数字
  1. 列表1
  2. 列表2
  3. 列表3
  4. 列表4
其中可以放文字,图片,或链接 有type属性,设置排序使用什么数字

表格的构成,
table,外框
tr 行
td 列





1-11-21-3
2-12-22-3
3-13-23-3

3行 3列
表格的属性
border 边框粗细
th,是tr的属性,列标题,自动居中,加粗
colspan,横向合并单元格,需要 整形参数
name
表格的合并
rowspan ,列项合并,整数参数
caption 给表格加标题 子属性
表格还有3个字属性
thead 都是双标签
tbody
tfoot
这些属性,后期主要和css,js配合使用
9 html 实体
用于输出一些特殊的字符
有些特殊的字符不能直接在网页中直接显示的

10 style 元素,html样式
引入样式的三种方法
1),外部样式 需要css

2)内部样式 样式需要放在之间,这个属于布局。 3).内联样式

单独的设置一个
  1. div布局 需要配合css样式设置
    9.html
    12 通用属性
    每个元素都用
    id属性,指定元素的标识符,唯一性。
    class 指定类型名,归类,统一设置共同的属性
    title 当鼠标移动到元素的时候显示的内容
    dir 用于控制显示输出的方向
    123456
    style 样式设置

12,表单 传递参数,数据

13,input元素,(输入框)他是表单的一个字属性 指定表单中的内容项,比如输入内容的文本框 可以指定表单属性,也可以放在表单的外面。 input元素的属性: type,指定输入框的类型,text单行文本,password密码,submit提交按钮, reset,重置按键,button按键,普通的按键需要和特定的时间关联。 image:图片式按键 hidden:隐藏字段,该内容不显示在页面上,提交其他的一些变量。 email: 是一个邮箱类型,新特性,可能支持有差异 required:表示内容必须填写,不然不能提交。 name:名称,输入内容识别名称,传递参数时候的参数名称 value: 默认值,输入框默认填入的内容, maxlength,指定最大长度 placeholder,设置提示信息的。

HTML网页制作参考手册

https://www.w3school.com.cn/tags/index.asp

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/749754.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

鸿蒙开发实现弹幕功能

鸿蒙开发实现弹幕功能如下&#xff1a; 弹幕轮播组件&#xff1a;BannerScroll import type { IDanMuInfoList, IDanMuInfoItem } from ../model/DanMuData //定义组件 Component export default struct BannerScroll {//Watch 用来监视状态数据的变化&#xff0c;包括&#…

Java代码基础算法练习-判断字符串是否为回文-2024.03.16

任务描述&#xff1a; 回文串是指一个正读和反读都一样的字符串&#xff0c;比如“level”或者“noon”等。要求输入 一个字符串&#xff0c;判断此字符串是否为回文。&#xff08;注&#xff1a;设字符串长度小于20&#xff09; 任务要求&#xff1a; package suanfa;import…

反弹shell的正向连接和反向连接

正向连接 解释 通常指受害主机&#xff08;被控制端&#xff09;监听一个端口&#xff0c;由控制主机&#xff08;攻击端&#xff09;主动去连接受害主机的过程。 通俗的讲&#xff0c;正向连接就是&#xff1a;攻击机主动连接被攻击机 命令 Linux服务器主动控制windows服务…

Vue:内置组件:KeepAlive(缓存组件实例)

一、作用 <KeepAlive></KeepAlive>能缓存包裹的所有组件&#xff0c;保证组件在切换时维持组件状态。 默认情况下&#xff0c;一个组件实例在被替换掉后会被销毁。这会导致它丢失其中所有已变化的状态——当这个组件再一次被显示时&#xff0c;会创建一个只带有初…

部署一个本地的ChatGPT(Ollama)

一 下载Ollama Ollama下载地址&#xff1a;https://ollama.com/download 下载完后 二 安装运行 双击下载好的OllamaSetup.exe开发 安装Ollama: 安装完成后&#xff0c;多了一个Ollama的菜单如下图 &#xff1a; Ollama安装好默认是配置开机运行&#xff0c;如果没有运行可以在…

mysql语句中想要查询某一月每一天日期的平均值 ,SSM框架如何实现

mysql语句中想要查询某一月每一天日期的平均值 为了查询某一月份每一天的平均值&#xff0c;你可以使用以下SQL查询语句。这里假设你有一个表格data_table&#xff0c;它有一个日期时间列date_column和一个需要计算平均值的数值列value_column。 SELECTDATE_FORMAT(date_colum…

MyBatis plus自动生成代码

1.pom文件配置 <dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-boot-starter</artifactId><version>3.5.3</version> </dependency> <dependency><groupId>com.baomidou</groupId>…

第五十九回 公孙胜芒砀山降魔 晁天王曾头市中箭-飞桨自然语言处理套件PaddleNLP初探

公孙胜献出八卦阵&#xff0c;宋江用八员大将守阵。项充李衮进入阵里&#xff0c;被抓住了。宋江说久闻大名&#xff0c;来梁山吧。两人说誓当效力到死&#xff0c;希望能先放我们两个回去把樊瑞带来一起。见到樊瑞后把宋江讲义气一说&#xff0c;樊瑞说不可逆天&#xff0c;于…

最短路径问题(Dijkstra/Floyd)

迪杰斯特拉算法 处理一个点到所有点最短路径问题 思路&#xff0c;动态规划思想&#xff0c;创建一个数组用于存储[1,n]到初始节点的距离&#xff0c;每次从中选择未确定为最短的点中取最短的那个&#xff0c;将他确定为最短的&#xff0c;因为就算是绕路也没有比他更短的&…

力扣112、113、101--树

112. 路径总和 题目描述&#xff1a; 给你二叉树的根节点 root 和一个表示目标和的整数 targetSum 。 判断该树中是否存在 根节点到叶子节点 的路径&#xff0c;这条路径上所有节点值相加等于目标和 targetSum 。 如果存在&#xff0c;返回 true &#xff1b;否则&#xff0c…

轻松搞定找不到vcomp140.dll无法继续执行程序的5种方法

在我们日常使用计算机的过程中&#xff0c;频繁且不可避免地会遭遇到各种类型的错误提示信息&#xff0c;这些错误信息往往会在关键时刻阻碍我们的操作进程。其中&#xff0c;有一个颇为常见的错误提示值得我们关注&#xff0c;那就是“vcomp140.dll丢失”。这个错误提示涉及到…

【计算机视觉】二、图像形成——实验:2D变换编辑(Pygame)

文章目录 一、向量和矩阵的基本运算二、几何基元和变换1、几何基元(Geometric Primitives)2、几何变换(Geometric Transformations)2D变换编辑器0. 程序简介环境说明程序流程 1. 各种变换平移变换旋转变换等比缩放变换缩放变换镜像变换剪切变换 2. 按钮按钮类创建按钮 3. Pygam…

Python中sys.stdin.readline()与input()的区别

Python中sys.stdin.readline()与input()的区别 文章目录 Python中sys.stdin.readline()与input()的区别1.概念上的区别2.使用上的区别2.1异常处理2.2可重定向输入2.3迭代读取2.4灵活性2.5两种循环读取方式 1.概念上的区别 在 Python 中&#xff0c;input() 和 sys.stdin 是用于…

更安全的C gets()和str* 以及fgets和strcspn的用法

#include <stdio.h>int main() {char *str;gets(str);puts(str);return(0); }可以说全是错误 首先char *str没有指向一个分配好的地址&#xff0c;就直接读入&#xff0c;危险 ps: 怎么理解char *str "Hello World" 是将一个存储在一个只读的数据段中字符串常…

c语言:一元二次方程(可能有复根)

一元二次方程&#xff08;可能有复根&#xff09; 任务描述 输入三个系数&#xff0c;求一元二次方程的解,要求输出所有可能的情况,包括复根。 输入格式: 三个实数a,b,c 输出格式: 按输出样例格式输出&#xff0c;注意输出顺序。 输入示例1 1 6 9输出示例1 x1x2-3.00000…

AI预测-一文解析AI预测数据工程

AI预测相关目录 AI预测流程&#xff0c;包括ETL、算法策略、算法模型、模型评估、可视化等相关内容 最好有基础的python算法预测经验 EEMD策略及踩坑VMD-CNN-LSTM时序预测对双向LSTM等模型添加自注意力机制K折叠交叉验证optuna超参数优化框架多任务学习-模型融合策略Transform…

《操作系统实践-基于Linux应用与内核编程》第10章-Linux综合应用

前言: 内容参考《操作系统实践-基于Linux应用与内核编程》一书的示例代码和教材内容&#xff0c;所做的读书笔记。本文记录再这里按照书中示例做一遍代码编程实践加深对操作系统的理解。 引用: 《操作系统实践-基于Linux应用与内核编程》 作者&#xff1a;房胜、李旭健、黄…

复现文件上传漏洞

一、搭建upload-labs环境 将下载好的upload-labs的压缩包&#xff0c;将此压缩包解压到WWW中&#xff0c;并将名称修改为upload&#xff0c;同时也要在upload文件中建立一个upload的文件。 然后在浏览器网址栏输入&#xff1a;127.0.0.1/upload进入靶场。 第一关 选择上传文件…

数字孪生-使用Unity构建能实时显示应力应变的孪生模型

Motivation - 采用Unity作为孪生技术栈的经历? 最开始想要利用Ansys的Twin Builder模块来进行数字孪生的开发&#xff0c;但是Ansys 的Twin Builder在部署的时候&#xff0c;需要license&#xff0c;要获得license所要花费的价格是难以接受的。 后来想要利用QTVTK的方式来进行…

C++/CLI学习笔记3(快速打通c++与c#相互调用的桥梁)

c/cli变量和操作符 3.1:什么是变里 变量是存储数据以便应用程序临时使用的内存位置&#xff0c;具有名称、类型和值。变量值在应用程序执行期间可能改变&#xff0c;变量名也是。变量使用前必须声明&#xff0c;即指定类型和提供名称。变量的类型决定了值的范围以及能执行的操…