WEB前端网页设计 HTML网页代码 基础参数(一)

news2024/9/20 14:32:41

插入图片:<img src="./图像URL">

整个HTML格式分为两大部分,一个是head部分,一个是body部分,其中head部分是用于书写网页样式,而body部分用于书写网页主题

标题标记

<h1></h1>

...

<h6></h6>

<p></p>

段落标签

<b></b> <strong></strong>

加粗  

<i></i>

倾斜

<br/>

换行

标签 功能

<br />

 插入一个换行简单的换行符

<hr />

定义水平线

<area />

定义图像映射内部的区域

<base />

 定义页面中所有链接的默认地址或默认目标

< img />

定义图像

<input />

 定义输入控件

<link />

定义文档与外部资源的关系

<meta />

定义关于 HTML 文档的元信息

<basefont />

 不建议使用。定义页面中文本的默认字体、颜色或尺寸

<param />

定义对象的参数

<col />

定义表格中一个或多个列的属性值

<frame />

 定义框架集的窗口或框架

<embed />

定义外部交互内容或插件

表格:

#例:行       

表格中 内容边框线的间距

<cellpadding="…">

格子格子之间的间距

<cellspacin="…">

给表格设置底纹

<table bgcolor="颜色">

表格开始

<table>

表题目

<caption>

合并单元格<>

<rowspan=“…”>     ##垂直合并

合并单元格<>

<colspan="…">        ##水平合并

批量复制参数

*10                 ##tab键补全

HTML注释符:

<!--  在此添加注释句-->     ##快捷键:CTRL+/

普通文字标签:

<p>…</p>     ##可分行

换行标签:

<br />           ##一个br换一行

选择整行

CTRL+L

网页名称插入:

<title>…….</title>

插入文本:

<h1> …… </h1>

居中对齐:

<h1 align=“center”>  …</h1>

颜色变换:

<hr  color=“red”   />

长度属性:

<hr width="500px"  />     ##px像素

右对齐:

<..  align=“right”>..<..>     左:left

粗细:

<size=“2”>

      下标

 sub  表示  下标

      上标

sup  表示  上标

左对齐

<align="left">

右对齐

<align="right">

文字行目显上

<align="top/texttop">

文字行目居中

<align="middle/absmiddle">

文字行目显下

<align="bottom/baseline">

插入图片:<img src="./图像URL">

已插入图片的副属性/标识:<alt="…">    ##运行后 当图片消失即文字显示

插入图片后当鼠标光标移到图片是即显示文字内容:<title="…">

给图片添加外边框:<border="4px">    #表示边框的粗细为4个像素

长度属性:<width=“400/75%px”>      #可数字也可百分比

高度属性:<height="…">

水平间距:<hspace="…">

垂直间距:<vspace="…">

自动填充单词数量:lorem100      ##数字为多少即生成多少,默认80;按TAB键补全

超链接:<a  href="…">文本说明</a>

例如------->>    <a  href="http://www.baidu.com">链接到百度</a>

<a  href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>

窗口弹出方式

描述

_self  

默认网页

_blank 

另一个窗口打开网页

这两者与之对应,在同一网页下,上方显示锚点链接,下方链接至此

锚点超链接:<a  href="#id链接处">说明</a>

<h  id="链接文本">

项目符号

<li>…</li>

鼠标滚轮移动至下方-->返回顶部

<a  href="#top">返回顶端</a>

将两个HTML文件建立在相同文件项目  进行两个网页切换

主、内  网页切换:

<a href="内页.html">这是内页</a>

<a href="主页.html">这是主页</a>    

<a href="http://https://www.douban.com/"><img src="./img2.jpg" ></a>

   ##黄底处输入相对应的html文件名或域名##红字处输入相应文字说明或插入图片参数

连续输入多个p元素,浏览器默认上下排列。

改变网页背景颜色

<body  bgcolor="yellow">

text-decoration: none;

去除下划线

<a  href=“#”>  <a>

为“#”时表示不链接任何网页

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

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

相关文章

生产型企业中采购管理系统的优势有哪些?

采购是生产型企业重要的环节&#xff0c;采购成本更是与企业利润息息相关。通常企业采购主要是取自于企业本身的需求&#xff0c;由于不同企业的需求不同&#xff0c;采购管理也就自然有所区别了。尤其是对于中小型企业而言&#xff0c;由于其本身规模有限&#xff0c; 生产资金…

[附源码]JAVA毕业设计健身房管理系统(系统+LW)

[附源码]JAVA毕业设计健身房管理系统&#xff08;系统LW&#xff09; 目运行 环境项配置&#xff1a; Jdk1.8 Tomcat8.5 Mysql HBuilderX&#xff08;Webstorm也行&#xff09; Eclispe&#xff08;IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持&#xff09;。 项目技术&a…

如何在Linux下 自定义/编写 一个守护进程

【摘要】本文主要讲述何为守护进程&#xff0c;以及如何自编或者利用现有程序将其伪装成守护进程。 何为守护进程&#xff1f; 正常情况下&#xff0c;当我们运行一个前台或后台进程时&#xff0c;一旦离开当前会话&#xff08;终端&#xff09;&#xff0c;那该会话中的所有…

BlockingQueue

网上看了好多文章将线程池的但是似乎都没的多少人会详细讲解里面的任务队列&#xff0c;所以只有自己动手学习其中的任务队列 BlockingQueue 要学习其中的任务队列就需要先学习BlockingQueue&#xff0c;Blocking是一个接口&#xff0c;其中主要的方法为 // 尝试往队尾添加元素…

m基于OFDM的OMP压缩感知信道估计算法误码率仿真,对比传统的LS,MMSE以及LMMSE信道估计性能

目录 1.算法描述 2.仿真效果预览 3.MATLAB核心程序 4.完整MATLAB 1.算法描述 正交频分复用技术(orthogonalfrequencydivisionmultiplexing,ofdm)应用在通信系统中可以有效抵抗码间干扰(inter-symbolinterference,isi)。同时&#xff0c;通过在符号间插入循环前缀(cyclicpre…

格利尔在北交所上市:市值突破9亿元,朱从利夫妇为实控人

12月2日&#xff0c;格利尔数码科技股份有限公司&#xff08;下称“格利尔”&#xff0c;BJ:831641&#xff09;在北京证券交易所上市。本次上市&#xff0c;格利尔公开发行1050万股&#xff0c;发行价格为9.60元/股&#xff0c;发行市盈率为23.32倍。 据了解&#xff0c;格利尔…

压缩文件7-Zip与WinRAR个人免费版在不同压缩等级下的对比

总结&#xff1a; 压缩率越高&#xff0c;压缩及解压时间相对更长&#xff0c;但传输时间越短&#xff0c;消耗流量越少。在各个压缩等级下&#xff0c;7-Zip均比RAR的压缩率更高&#xff0c;更能达到**“压缩”**的目的&#xff1b;而且相同参数下的压缩速度更快&#xff0c;…

基于增强蛇优化算法求解单目标优化问题附matlab代码

✅作者简介&#xff1a;热爱科研的Matlab仿真开发者&#xff0c;修心和技术同步精进&#xff0c;matlab项目合作可私信。 &#x1f34e;个人主页&#xff1a;Matlab科研工作室 &#x1f34a;个人信条&#xff1a;格物致知。 更多Matlab仿真内容点击&#x1f447; 智能优化算法 …

从源码分析vue3组件的生命周期

概览 借官网一张图充篇幅☺ 这张图展示了一个vue组件从开始渲染到卸载结束一整个生命周期经历的每个环节 但只罗列了选项式api生命周期钩子&#xff0c;没有将组合式api的生命周期钩子放进去 下面这个表格列出了所有选项式api生命周期钩子和组合式api生命周期钩子&#xff0c…

函数的节流和防抖?节流和防抖的区别及实现

一.防抖和节流的本质 本质上就是优化高频率执行代码的一种手段。 比如说&#xff1a;浏览器的scroll,keypress,mousemove,resize等事件在触发时&#xff0c;会不断的调用绑定在事件上的回调函数&#xff0c;会极大地浪费资源&#xff0c;降低前端的性能。 因此为了优化用户体…

【C++模板】非类型模板参数

目录什么是非类型模板参数&#xff1f;非类型的类模板参数非类型的函数模板参数非类型模板参数的局限性限制使用的场景支持使用的场景什么是非类型模板参数&#xff1f; 在函数模板和类模板中&#xff0c;模板参数并不仅仅可以当作类型&#xff0c;还可以当作普通值。当使用普通…

Numpy解决找出二维随机矩阵中每行数据中最接近某个数字的数字

解决思路&#xff1a; 利用np.random.rand()函数生成随机的矩阵。abs函数实现对矩阵中每一个元素和指定元素相减np.argsort()函数实现找到排序后新元素在原来矩阵中的下标利用mask函数提取矩阵中第一列的元素最后利用for循环遍历所有的二维坐标&#xff0c;找到矩阵中每行中满…

微信小程序-读取数据

在开发微信小程序的时候,我们经常都会用到一些配置数据,或者当做“单向数据库(只读)”使用。 我们新建一个新的项目工程,JS版本就可以。 免于麻烦,我们新建一个page(showdata)来显示数据。 为了方便管理,我们在项目工程新建一个目录(data),用于存数据。另外我们再新…

面向对象-05-06-构造方法,标准的 javabean 类

实例化的本质就是调用构造方法 package com.luo.demo01;public class StudenTest {public static void main(String[] args) {// 创建对象// 本质&#xff1a;调用构造器Student s new Student();Student student new Student("luo",18);System.out.println(studen…

Git系列,自定义 git 命令,用 shell 脚本帮助你更好的实现 git 版本控制

一、问题引出 在实际的生产当中&#xff0c;无论是 git、小乌龟 git 、idea git 插件&#xff0c;都满足不了我们生产中遇到的一些常见的问题&#xff0c;例如&#xff1a; 工作任务重的时候&#xff0c;手头上可能有若干个分支&#xff0c;每个分支对应着不同的业务&#xf…

Mysql面试题汇总

Mysql面试题 文章目录Mysql面试题一 Mysql索引001 Mysql如何实现的索引机制&#xff1f;002 InnoDB索引与MyISAM索引实现的区别是什么&#xff1f;003 一个表中如果没有创建索引&#xff0c;那么还会创建B树吗&#xff1f;004 说一下B树索引实现原理&#xff08;数据结构&#…

妙啊,Python 管道 Pipe 编写代码如此优雅

大家好&#xff0c;今天这篇文章我将详细讲解 Pipe 如何让你的代码更加简洁的方法&#xff0c;喜欢本文点赞支持&#xff0c;欢迎收藏学习&#xff0c;文末提供技术交流群&#xff0c;欢迎畅聊&#xff01; 我们知道 map 和 filter 是两种有效的 Python 方法来处理可迭代对象。…

如何基于YAML设计接口自动化测试框架?看完秒会!

在设计自动化测试框架的时候&#xff0c;我们会经常将测试数据保存在外部的文件&#xff08;如Excel、YAML、CSV&#xff09;或者数据库中&#xff0c;实现脚本与数据解耦&#xff0c;方便后期维护。目前非常多的自动化测试框架采用通过Excel或者YAML文件直接编写测试用例&…

[附源码]计算机毕业设计springboot招聘系统

项目运行 环境配置&#xff1a; Jdk1.8 Tomcat7.0 Mysql HBuilderX&#xff08;Webstorm也行&#xff09; Eclispe&#xff08;IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持&#xff09;。 项目技术&#xff1a; SSM mybatis Maven Vue 等等组成&#xff0c;B/S模式 M…

电子学会2021年6月青少年软件编程(图形化)等级考试试卷(四级)答案解析

青少年软件编程&#xff08;图形化&#xff09;等级考试试卷&#xff08;四级&#xff09; 分数&#xff1a;100.00 题数&#xff1a;24 一、单选题&#xff08;共10题&#xff0c;每题3分&#xff0c;共30分&#xff09; 1. 执行下列程序&#xff0c;输出的结果为…