Html基本标签与案例

1.html与css的关系

  

2.程序

 1 <!DOCTYPE HTML>
 2 <html>
 3     <head>
 4         <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 5         <title>Html和CSS的关系</title>
 6         <style type="text/css">
 7         h1{
 8             font-size:12px;
 9             color:#999;
10             text-align:center;
11         }
12         </style>
13     </head>
14     <body>
15         <h1>Hello World!</h1>
16     </body>
17 </html>

3.效果

  

4.注释

  <!--注释文字 -->

5.p标签

  <p>段落文本</p>

6.hx标签

  文章的标题用什么标签呢?在本节我们将使用<hx>标签来制作文章的标题。

  标题标签一共有6个,h1、h2、h3、h4、h5、h6分别为一级标题、二级标题、三级标题、四级标题、五级标题、六级标题。并且依据重要性递减。<h1>是最高的等级。

  <hx>标题文本</hx>

7.strong与em标签

  但两者在强调的语气上有区别:<em> 表示强调,<strong> 表示更强烈的强调。

  并且在浏览器中<em> 默认用斜体表示,<strong> 用粗体表示。两个标签相比,目前国内前端程序员更喜欢使用<strong>表示强调。

  <em>需要强调的文本</em>

  <strong>需要强调的文本</strong>

8.span标签

  使用<span>标签为文字设置单独样式

  标签是没有语义的,它的作用就是为了设置单独的样式用的

  

9.q标签

  <q>标签,短文本引用。

  注意要引用的文本不用加双引号,浏览器会对q标签自动添加双引号。

10.

时间: 2024-12-07 15:37:24

Html基本标签与案例的相关文章

深入分析JavaWeb Item25 -- 自定义标签开发案例和打包自定义标签库

一.开发标签库案例 1.1.开发防盗链标签 1.编写标签处理器类:RefererTag.java package me.gacl.web.simpletag; import java.io.IOException; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import javax.servlet.jsp.JspException; import jav

javaweb学习总结(二十七)——jsp简单标签开发案例和打包

一.开发标签库 1.1.开发防盗链标签 1.编写标签处理器类:RefererTag.java 1 package me.gacl.web.simpletag; 2 3 import java.io.IOException; 4 import javax.servlet.http.HttpServletRequest; 5 import javax.servlet.http.HttpServletResponse; 6 import javax.servlet.jsp.JspException;

javaweb学习总结(二十六)——jsp简单标签标签库开发(二)

一.JspFragment类介绍 javax.servlet.jsp.tagext.JspFragment类是在JSP2.0中定义的,它的实例对象代表JSP页面中的一段符合JSP语法规范的JSP片段,这段JSP片段中不能包含JSP脚本元素. WEB容器在处理简单标签的标签体时,会把标签体内容用一个JspFragment对象表示,并调用标签处理器对象的setJspBody方法把JspFragment对象传递给标签处理器对象.JspFragment类中只定义了两个方法,如下所示: getJspCon

Javaweb学习笔记6—EL表达式与JSTL及自定义标签

 前几天博客被黑了,导致博客登陆不上,把前几天应该发的东西的东西重新发一遍 今天来讲javaweb的第六阶段学习. EL表达式与JSTL及自定义标签是对上篇文章介绍的JSP的扩展,不能说是很重要的东西,但是也要了解. 老规矩,首先先用一张思维导图来展现今天的博客内容. ps:我的思维是用的xMind画的,如果你对我的思维导图感兴趣并且想看到你们跟详细的备注信息,请点击下载 另外:如果图看不清的话请右击---在新窗口中打开会清楚很多. 一.EL表达式 1,EL简介 Expression Lan

label 标签

在表单布局中会遇到label标签的使用,label没有任何样式效果,有触发对应表单控件功能.比如我们点击单选按钮或多选框前文字对应选项就能被选中,这个就是对文字加了<label>标签实现. 一.点击文字,对应选择上控件   -   TOP 点击<label>标签文字时,实现对应控件被选择,需要对应表单控件id的值与label标签内的for值相同. 二.label语法   -   TOP <label for="man">男</label>

HTML5每日一练之details展开收缩标签的应用

details标签的出现,为我们带来了更好的用户体验,不必为这种收缩展开的效果再编写JS来实现.注:目前仅Chrome支持此标签. details有一个新增加的子标签——summary,当鼠标点击summary标签中的内容文字时,details标签中的其他所有元素将会展开或收缩. detalis标签: 案例1: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" conte

java_自定义标签,我的第一个自定义标签!

自定义标签,我的第一个自定义标签! 总共分两步 编写一个实现tag接口的java类,把jsp页面中的java代码移到这个类中,(标签处理器类) 编写标签库描述符(tld)文件,在tld文件中把标签处理器类描述成一个标签 一.案例, 输出客户端IP ViewIP.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%&g

H5新特性之语义化标签

二月底,疫情仍未过去,在家逆战学习. 说道H5新特性的语义化标签,就不得不先简单说一下它的发展史,兼容和一些语法问题. H5在经过多达近百项的修改,包括HTML和XHTML的标签,相关的API,Canvas等,性 能得到进一步提升. H5仅仅是新增添了一些内容并优化了它们,而不是全盘否定之前的旧的内容.支持Html5 的浏览器包括Firefox(火狐浏览器),IE9及其更高版本,Chrome(谷歌浏览器),Safari, Opera等以及一些国内浏览器. 对于H5语法变化不大,文件的扩展名是不变

javascript操作dom对象

什么叫DOM? DOM是文档对象模型(Document Object Model,是基于浏览器编程(在本教程中,可以说就是DHTML编程)的一套API接口,W3C出台的推荐标准,每个浏览器都有一些细微的差别,其中以Mozilla的浏览器最与标准接近. DOM属于浏览器,而不是JavaScript语言规范里的规定的核心内容. 查找元素 1.直接查找 方法名 描述 getElementById(id) (document) 获取有指定惟一ID属性值文档中的元素 getElementsByTagNam