首页 > 编程语言 >JavaWeb - HTML基础

JavaWeb - HTML基础

时间:2024-03-17 15:30:29浏览次数:27  
标签:语文 JavaWeb 标签 xxx 基础 3333 HTML 内容 文本

常用标签

  • font 文本标签

    <font face="黑体" color="#0099FF">黑体效果</font>
    <font size="3" color="#990000">3号文字效果</font>
    <!-- face=字体样式,color=颜色,size:字体大小 -->
  • p 段落标签、br 换行标签

    本段落内容...<p> 第二段内容<p> 第三段内容<br> 第四行内容...<br> 第五行内容 
    <!-- 标签区别:p标签换行但是带的默认间距比br大 -->

  • strong 粗体文本、em 斜体文本、u 带下划线文本、sup 上标文本、sub 下标文本

    <strong>粗体文字</strong> 
    <em>斜体文字</em>
    <u>下划线文字</u>
    <sup>上标文字</sup> <sub>下标文字</sub> 
    <!-- 上下标举例使用 -->
     H<sub>2</sub>O:氢气 A<sup>2</sup>+B<sup>2</sup>=1

  • 常见特殊符号

    <!-- 小于号:&lt; --> 
    7&lt;9
    <!-- 空格符:&nbsp; --> 
    在&nbsp&nbsp吗=在 吗 
    <!-- 版权符:&copy; --> 
    &copy; Copyright xxx公式版权所有

  • a 超链接标签、img 图片标签

    <!-- a标签不加target默认为_self:直接在当前窗口打开,_blank:新建窗口打开 --> 
    <a href="http://www.baidu.com">百度一下</a> 
    <a href="http://www.baidu.com" target=_self>百度一下</a> 
    <a href=http://www.baidu.com target=_blank>百度</a> 
    <!-- img标签 --> 
    <!-- 图片路径可使用本地相对路径或超链接路径 --> 
    <img src="图片路径"> <img src="x.jpg" width=300px;height=90px> 
    <!-- width:定义显示宽度,height:定义显示高度 -->
  • audio 音频标签、video 视频标签

    <!-- src:资源位置,本地相对或外链 -->
    <audio src="./video/1.mp3" controls></audio>
    <video src="./video/1.mp4" controls></video>
  • 列表标签:ul、ol

    <!-- 无序列表 --> 
    <ul> <li>111</li> <li>111</li> <li>111</li> </ul> <br> <br> 
    <!-- 有序列表 --> 
    <ol> <li>222</li> <li>222</li> <li>222</li> </ol> 
    <!-- 有序字母显示 --> 
    <ol type=A> <li>3333</li> <li>3333</li> <li>3333</li> <li>3333</li> <li>3333</li> </ol>
  • 表格标签

    <!-- 表格标签 table -->
    <table></table>
    <!-- th:表头(默认居中) -->
    <table>
    <th>表头xxx</th>
    </table>
    <!-- tr:行、td:单元格 -->
    <table>
    <th>表头xxx</th>
    <tr>
      <td>第一个单元格(除表头外)</td>
    </tr>
    </table>
    <!-- table属性:border:边框,cellspacing:边框间距,align:对其方式,width、height:宽、高 -->
    <table border=1 cellspacing=0 align=center width=80%></table>
    <!-- 合并单元格:colspan:合并列(左右合并)、rowspan:合并行(上下合并) -->
    <th colspan=5 >合并5列</th>
    <th rowspan=5 >合并5行</th>
    <!-- 课程表实例 -->
    <!-- 课程表 -->
    <table border=1 cellspacing=0 align=center width=80%>
    <th></th>
    <th colspan=5 align=center>课程表</th>
    <tr align=center>
    <td rowspan=5>上午</td>
    <td>星期一</td>
    <td>星期二</td>
    <td>星期三</td>
    <td>星期四</td>
    <td>星期五</td>
    </tr>
    <tr align=center>
    <td>综合实践活动</td>
    <td>数学</td>
    <td>语文</td>
    <td>数学</td>
    <td>语文</td>
    </tr>
    <tr align=center>
    <td colspan=5>课间操</td>
    
    </tr>
    <tr align=center>
    <td>数学</td>
    <td>语文</td>
    <td>语文</td>
    <td>校本课程</td>
    <td>劳动</td>
    </tr>
    <tr align=center>
    <td colspan=5>眼保健操</td>
    
    </tr>
    <tr align=center>
    <td rowspan=3>下午</td>
    <td>语文</td>
    <td>书法</td>
    <td>数学</td>
    <td>语文</td>
    <td rowspan=2>美术</td>
    </tr>
    <tr align=center>
    <td rowspan=2>体育与健康</td>
    <td>地方课程</td>
    <td>音乐</td>
    <td>学校课程</td>
    </tr>
    <tr align=center>
    <td>音乐</td>
    <td>英语</td>
    <td>体育与健康</td>
    <td>科学</td>
    </tr>
    </table>

  • form 表单

    <!-- 
    action:提交位置URL,#:本地
    -----
    method:提交方式
       get:提交给当前页面,4kB(x=xxx显示提交)
       post  (url不显示提交,在协议head里)
    -----
    name=xxx(DB中的键名)
    -----
    单选框:radio
    复选框:checkbox
    <input type=xxx name=xxx(与DB中一致且本框内相同) value=提交值 >显示内容
    <input type=xxx name=xxx(与DB中一致且本框内相同) value=提交值 >显示内容
    <input type=xxx name=xxx(与DB中一致且本框内相同) value=提交值 >显示内容
    -----
    下拉框:select
    <select name=xxx >
    <option value=>xxx</option>
    <option value=>xxx</option>
    <option value=>xxx</option>
    </select>
    -----
    文本域:textarea
    <textarea></textarea>
    -->
    <!-- 实例 -->
    <form action=# method=post  >
    用户名<input  type=text name=username>
    <br><br>
    电话
    <input  type=text name=phone>
    <br><br>
    性别
    <input  type=radio name=sex value=male>男
    <input type=radio name=sex value=female>女
    <br><br>
    兴趣
    <input type=checkbox name=like vlaue=摸鱼>上班
    <input type=checkbox name=like vlaue=划水>加班
    <input type=checkbox name=like vlaue=吹牛>倒班
    <br><br>
    密码<input  type=password name=pass>
    <br><br>
    头像<input type=file>
    <br><br>
    留言:<textarea rows="5" cols="3"></textarea>
    <!-- 三行五列文本框 -->
    <br><br>
    <input type=submit value=注册>
    <!-- value:提交按钮显示文本 -->
    <br>
    </form>

    博客文章

  • 好烦小窝icon-default.png?t=N7T8https://www.fanwo.top/archives/818.html

标签:语文,JavaWeb,标签,xxx,基础,3333,HTML,内容,文本
From: https://blog.csdn.net/Fan738/article/details/136779192

相关文章

  • HTML学习笔记5: table表格标签
    table表格标签tableborder            表格边框的宽度width规定表格的宽度cellspacing规定单元格之间的空隙tr:行td:单元格th:如果是表头单元格,可以替换为th,默认带有加粗和居中展示的效果<tableborder="5px"width="6......
  • HTML学习笔记6: form表单标签
    Form表单标签属性action   规定当提交表单时向何处(URL)发送表单数据如果不指定URL,默认提交到当前页面method   规定用于发送表单数据的方式(默认值是GET)GET  在URL后拼接表单数据:?username=hikaru44&age=2000,URL的长度是有限制的,所以GET没......
  • HTML学习笔记7: form表单项
    表单项input    定义表单项,通过type属性控制输入形式select定义下拉列表textarea定义文本域inputtext文本框姓名:<inputtype="text"name="name"><br><br>password密码框密码:<inputtype="password"name="pass......
  • HTML学习笔记4: 盒子模型
    盒子模型布局标签div&spanDIV一行只显示一个,宽度默认是父元素的宽度, 高度默认由内容撑开,可以设置宽高设置div的CSS样式<style>div{width:200px;height:200px;box-sizing:border-box;/*指定widthheight为盒子的宽高*/......
  • nginx基础篇
    web服务器介绍Unix和Linux平台下的常用Web服务器常见有:ApacheNginxLighttpdTomcatIBMWebSphere其中最为广泛的是Nginx,在Windows平台上最常用的是微软的IIS(InternetInformationServer,互联网信息服务)是Windows系统中默认的Web服务程序。nginx介绍nginx是什么1.......
  • HTML学习笔记1: 常见标签
    HTML常见标签p段落标签<p>段落内容</p>b加粗标签<b>加粗标签</b>strong加粗+强调标签strong和b在样式上没有什么差别,只是便于强调区分<strong>强调+加粗标签</strong>img图片标签src图片路径(绝对磁盘路径,绝对网页路径,相......
  • HTML学习笔记3: CSS选择器
    CSS选择器元素选择器<style>p{color:lightcoral;}</style><!--元素选择器:设置了某个元素(span,p,h1)的样式--><p>元素选择器</p>类选择器<style>.hclass{color:lightgoldenrodyellow;}</style><!--类选择器:给标签指定一个类--><......
  • HTML学习笔记2: CSS样式
    【HTML】CSS样式设置CSS样式的三种方式行内样式(不推荐)内嵌样式(写在style标签中,可以写在页面各种位置,一般写在head标签中)外联样式写在单独的css文件中,需要通过link在网页中引入行内样式<h1style="color:rgb(66,139,92);">行内样式</h1>内嵌样式<style> ......
  • Python基础语法
    Python目录-基础语法注释数据类型数据类型准换字面量变量数据输出数据输入标识符运算符判断语句循环语句注释单行注释#以#号开头,#号和注释内容建议以一个空格隔开多行注释"""以三个双引号引起来三个双信号之中写注释内容"""数据类型Python中常用......
  • 通信基础概念
    参考视频:https://www.bilibili.com/video/BV14o4y1Y7A1?p=1&vd_source=432ba293ecfc949a4174ab91ccc526d6并行通信:并行通信:计算机与I/O设备之间,通过多条传输线,可以同时传输多个bit位的信号。如下图所示:串行通信:串行通信:计算机与I/O设备之间,同一时刻,只能传输一个bit位的信号。......