简单的网页制作

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

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

平衡树——treap

treap实际上就是tree(BST&#xff0c;二叉搜索树)heap(堆) 我们维护一个二叉树来储存值&#xff0c;但是为了避免二叉树由于值太特殊变成链式结构&#xff0c;我们对于每个点加入一个val值&#xff0c;这个是随机值&#xff0c;我们通过这个随机值来维护一个大根堆(只与val有关…

JDK8和JDK11在Ubuntu18上切换(解决nvvp启动报错)

本文主要介绍JDK8和JDK11在Ubuntu18上切换&#xff0c;以供读者能够理解该技术的定义、原理、应用。 &#x1f3ac;个人简介&#xff1a;一个全栈工程师的升级之路&#xff01; &#x1f4cb;个人专栏&#xff1a;计算机杂记 &#x1f380;CSDN主页 发狂的小花 &#x1f304;人…

Android Studio实现内容丰富的安卓宠物用品商店管理系统

获取源码请点击文章末尾QQ名片联系&#xff0c;源码不免费&#xff0c;尊重创作&#xff0c;尊重劳动。 项目编号128 1.开发环境android stuido jdk1.8 eclipse mysql tomcat 2.功能介绍 安卓端&#xff1a; 1.注册登录 2.系统公告 3.宠物社区&#xff08;可发布宠物帖子&#…

ts的interface和type区别

1. 场景 interface 是用来描述对象类型的结构&#xff0c;可以定义对象的属性名和属性值的类型&#xff0c;也可以定义函数类型。interface User {name: string;age: number;sayHello(): void; } const user: User {name: "",age: 2,sayHello() {...} }可以用这个U…

Linux 自动备份 mysql 脚本

这个脚本会将数据库备份为一个SQL文件&#xff0c;并将其保存在指定的目录中。 #!/bin/bash# MySQL配置 DB_USER"your_mysql_username" DB_PASS"your_mysql_password" DB_NAME"your_database_name" DB_HOST"localhost"# 备份目录 BAC…

力扣hot100:416.分割等和子集(组合/动态规划/STL问题)

组合数问题 我们思考一下&#xff0c;如果要把数组分割成两个子集&#xff0c;并且两个子集的元素和相等&#xff0c;是否等价于在数组中寻找若干个数使之和等于所有数的一半&#xff1f;是的&#xff01; 因此我们可以想到&#xff0c;两种方式&#xff1a; ①回溯的方式找到t…

springboot275毕业就业信息管理系统的设计与实现

毕业就业信息管理系统设计与实现 摘 要 传统办法管理信息首先需要花费的时间比较多&#xff0c;其次数据出错率比较高&#xff0c;而且对错误的数据进行更改也比较困难&#xff0c;最后&#xff0c;检索数据费事费力。因此&#xff0c;在计算机上安装毕业就业信息管理系统软件…

安装jupyter报错:404 GET /static/notebook/4131.bundle.js

1、报错安装过程 我直接是pip install jupyter 进行的安装&#xff0c;如下&#xff0c;安装的版本是7.1.2 2、报错结果 运行jupyternotebook后报错&#xff1a;404 GET /static/notebook/4131.bundle.js (3bea7012d1534d70a935c3c193d9308d127.0.0.1) 5.70ms refererht…

SMART PLC 卷径计算(圈数检测+膜厚叠加法)

1、卷径计算(膜厚叠加+数值积分器应用博途PLC SCL代码) https://rxxw-control.blog.csdn.net/article/details/136719982https://rxxw-control.blog.csdn.net/article/details/1367199822、膜厚叠加法 https://rxxw-control.blog.csdn.net/article/details/128600466

关于前端打包加部署

1.首先输入命令 npm build 2.打包完成进入xshell&#xff0c;输入命令 tar -zcvf "da 20240315 登录.tar.gz" * 这个命令是在Linux或类Unix系统上使用的tar命令&#xff0c;用于创建一个名为 "da 20240315 登录.tar.gz" 的归档文件&#xff0c;其中包含…

皂液器问卷调查

媳妇非要买这种皂液器&#xff0c;来问问友友们有用过的帮忙识别一下是否是真的好用&#xff1a;皂液器问卷调查 4个题

代码随想录算法训练营第41天 | 01背包问题(二维+一维) ,416. 分割等和子集

动态规划章节理论基础&#xff1a; https://programmercarl.com/%E5%8A%A8%E6%80%81%E8%A7%84%E5%88%92%E7%90%86%E8%AE%BA%E5%9F%BA%E7%A1%80.html 01背包理论基础 链接&#xff1a;https://programmercarl.com/%E8%83%8C%E5%8C%85%E7%90%86%E8%AE%BA%E5%9F%BA%E7%A1%8001%…

C++初阶:模板初阶

目录 1. 模板的引入2. 函数模板与类模板2.1 函数模板2.2 模板调用方式2.3 函数模板与普通函数的调用优先性2.4 类模板2.5 类模板的构造函数&#xff0c;类模板声明与定义分离 1. 模板的引入 我们来看下面这几个函数&#xff1a; void swap(int& left, int& right) {int…

vuepress-theme-vdoing博客搭建教程

搭建流程 前言 这是笔者搭建个人博客所经历的流程&#xff0c;特附上笔记 笔者个人博客地址&#xff1a;沉梦听雨的编程指南 一、主题介绍 本博客使用的主题为&#xff1a;vuepress-theme-vdoing&#xff0c;相关介绍和使用方法可以参考该主题的官方文档 官方文档快速上手…

java线程池基础

目录 一、线程池基础概念1.1 什么是线程池&#xff1f;1.2 为什么要用线程池&#xff1f;1.3 线程池的工作原理 二、java中的线程池2.1 线程池真正实现类 ThreadPoolExecutor 2.1.2 构造器2.1.3 参数2.1.3.1 workQueue2.1.3.2 threadFactory2.1.3.3 handler 2.2 线程池的使用2.…

超详细解析:在执行一条SQL语句期间发生了什么?

目录 前言MySQL的执行流程Server层连接器查询缓存词法分析器预处理优化器执行器 引擎层具体流程为什么需要redologredolog的组成redolog如何提高性能&#xff1f;redo log与binlog区别 总结 前言 我们学习MySQL时&#xff0c;首先第一个接触到的就是SQL语句了&#xff0c;那么…

MD5算法:密码学中的传奇

title: MD5算法&#xff1a;密码学中的传奇 date: 2024/3/15 20:08:07 updated: 2024/3/15 20:08:07 tags: MD5起源算法原理安全分析优缺点比较技术改进示例代码应用趋势 MD5算法起源&#xff1a; MD5&#xff08;Message Digest Algorithm 5&#xff09;算法是由MIT的计算机…

Linux之shell条件测试

华子目录 用途基本语法格式示例 文件测试参数示例 整数测试作用操作符示例~&#xff1a;检查左侧内容是否匹配右侧的正则表达式 案例分析逻辑操作符符号示例 命令分隔符&>&#xff1a;不管成功与否&#xff0c;都将信息写进黑洞中 用途 为了能够正确处理shell程序运行过…

django开发流式格式后的在nginx的部署的记录

关键记录. django上传代码要导出配置 pip freeze > requirements.txt 这个很关键。后面部署直接读取的 关键记录. django上传代码要导出配置 pip freeze > requirements.txt 这个很关键。后面部署直接读取的 关键记录. django上传代码要导出配置 pip freeze > require…

Python 基础语法:基本数据类型(字典)

为什么这个基本的数据类型被称作字典呢&#xff1f;这个是因为字典这种基本数据类型的一些行为和我们日常的查字典过程非常相似。 通过汉语字典查找汉字&#xff0c;首先需要确定这个汉字的首字母&#xff0c;然后再通过这个首字母找到我们所想要的汉字。这个过程其实就代表了…