前端开发HTML&css入门——一些其他常用的文本标签
| em标签和strong标签 | i标签和b标签 | small标签 | cite标签 | q标签和blockquote标签 |
| em主要表示语气上的强调,em在浏览器中默认使用斜体显示 strong表示强调的内容，比em更强烈，默认使用粗体显示 |
i标签中的内容会以斜体显示，b标签中的内容会以加粗显示 h5规范中规定，对于不需要着重的内容而是单纯的加粗或者是斜体， |
在h5中使用small标签来表示一些细则一类的内容 |
网页中所有的加书名号的内容都可以使用cite标签，表示参考的内容， |
q标签表示一个短的引用（行内引用） blockquote标签表示一个长引用（块级引用） |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<p>
已经连着下了<em>一周雨</em>！
</p>
<p>
<strong>
再见不到太阳要死了！
</strong>
</p>
<p>
<i>我是i标签中的内容</i>
<b>我是b标签中的内容</b>
</p>
<p>
我是p标签中的内容<small>我是small标签中的内容</small>
</p>
<p>
<cite>《浪潮之巅》</cite>是最喜欢的一本书
</p>
<p>
子曰:<q>学而时习之不亦说乎！</q>
</p>
/*
需要注意的是，blockquote标签是块元素标签，不能放在p标签里
*/
<div>
鲁迅:
<blockquote>
时间，就象海棉里的水，只要愿挤，总还是有的。
</blockquote>
</div>
</body>
</html>
| sup标签 | sub标签 | del标签 | ins标签 | pre标签和code标签 |
| 设置一个上标 | 表示一个下标 | del标签中的内容，会自动添加删除线 | ins中的的内容，会自动添加下划线 |
pre是一个预格式标签，会将代码中的格式保存，不会忽略多个空格 我们一般结合使用pre和code来表示一段代码 |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
2的平方
-->
<p>2<sup>2</sup></p>
<!--
百科经常用上标和超链接结合
-->
<p>赵薇<sup><a href="#">[1]</a></sup></p>
<!--
水的分子式
-->
<p>H<sub>2</sub>O</p>
<p>
<del>17.75</del> <br />
15.54 <br />
</p>
<p>
台毒必遭<ins>灭亡</ins>！
</p>
<pre>
<code>
window.onload = function(){
alert("Hello World");
};
</code>
</pre>
</body>
</html>
列表标签：
| 无序列表 | 有序列表 | 定义列表 |
|
使用ul标签来创建一个无序列表 |
有序列表和无序列表类似，只不过它使用ol来代替ul type属性，可以指定序号的类型 |
定义列表用来对一些词汇或内容进行定义 |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css"> </style>
</head>
<body>
<!--
无序列表
-->
<ul>
<li>馒头</li>
<li>包子</li>
<li>饺子</li>
<li>豆包</li>
</ul>
<!--
有序列表
-->
<ol type="I">
<li>结构</li>
<li>表现</li>
<li>行为</li>
</ol>
</body>
</html>
列表之间可以互相嵌套。列表项目符号可以删除。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css"> /*
去掉项目符号
* */
ul{
list-style: none;
}
</style>
</head>
<body>
<ul>
<li>包子</li>
<li>馒头</li>
<li>饺子</li>
<li>豆包</li>
</ul>
<p>电脑</p>
<ul>
<li>
主机
<ol>
<li>CPU</li>
<li>内存</li>
<li>硬盘</li>
</ol>
</li>
<li>
外设
<ul>
<li>键盘</li>
<li>鼠标</li>
</ul>
</li>
<li>显示器</li>
</ul> </body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title> </head>
<body>
<dl>
<dt>cpu</dt>
<dd>中央处理器</dd>
<dd>计算机系统的运算和控制核心</dd>
<dt>硬盘</dt>
<dd>计算机的最主要的存储设备</dd>
</dl>
</body>
</html>
前端开发HTML&css入门——一些其他常用的文本标签的更多相关文章
- 前端开发HTML&css入门——常用的标签以及一个小练习
meta标签 <!doctype html> <html> <head> <meta charset="utf-8" /> < ...
- 前端开发HTML&CSS入门——具体是做什么的
软件开发,一提起来感觉这个感觉这个词范围很大很广,说起来也很笼统.不知所云,开发的到底是什么?或者说开发的具体内容是什么?以前我们讲软件开发主要是分前端和后端,那前端和后端又是什么那?你可以这么通俗的 ...
- 前端开发HTML&css入门——伪类选择器和一些特殊的选择器
伪类和伪元素 有时候,你需要选择本身没有标签,但是仍然易于识别的网页部位,比如段落首行或鼠标滑过的连接.CSS为他们提供一些选择器:伪类和伪元素. 常用的一些伪类选择器: :link :visited ...
- 前端开发HTML&css入门——CSS&选择器练习
CSS 层叠样式表 (Cascading Style Sheets)css可以用来为网页创建样式表,通过样式表可以对网页进行装饰.所谓层叠,可以将整个网页想象成是一层一层的结构,层次高的将会覆盖层次低 ...
- 前端开发HTML&css入门——HTML
HTML究竟为何物?其实HTML就是一种标记语言,英文全称为Hypertext Markup Language,翻译过来就叫超文本标记语言.它的作用就是负责负责网页的三个要素之中的结构. HTML使用 ...
- 前端开发HTML&css入门——盒子模型以及部分CSS样式
CSS处理网页时,它认为每个元素都包含在一个不可见的盒子里.• 为什么要想象成盒子呢?因为如果把所有的元素都想象成盒子,那么我们对网页的布局就相当于是摆放盒子.• 我们只需要将相应的盒子摆放到网页中相 ...
- 前端开发HTML&css入门——CSS的文本格式化
长度单位 像素 px 百分比 % em - 像素是我们在网页中使用的最多的一个单位, * 一个像素就相当于我们屏幕中的一个小点, * 我们的屏幕实际上就是由这些像素点构成的 * 但是这些像素点,是不能 ...
- 前端开发：css基础知识之盒模型以及浮动布局。
前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西? 为什么这个浮动没有效果? 这个问题楼主已经回答了n遍.今天则是把 ...
- 要web开发精品教程吗？免费无广告一百期连讲的那种-逐浪CMS前端开发100期入门教程全面开放
要web开发精品教程吗?免费无广告一百期连讲的那种-逐浪CMS前端开发100期入门教程全面开放 大师主讲 经验难得 由逐浪CMS首席架构师发哥老师,亲自主理讲解. 历时一年精心打造, 汇聚了互联网诞生 ...
随机推荐
- 容器适配器————heap
堆(heaps)不是容器,而是一种特别的数据组织方式.堆一般用来保存序列容器. 堆是一个完全二叉树,每个节点与其子节点位置相对.父节点总是大于或等于子节点,这种情况下被叫作大顶堆,或者父节点总是小于或 ...
- 使用Eigen遇到恶心报错
参考博客:https://www.cnblogs.com/wongyi/p/8734346.html 1. 数据类型报错 /home/wy/workdir/slambook/ch3/useEigen/ ...
- (WCF) There is already a listener on IP endpoint 0.0.0.0:9999.
有個nettcpbinding, service host總是不能起來,出現如題錯誤. 查了下,同樣的程序并沒有在進程裏面,但是看起來好像有其他的程序在占用這個Port C:\Program File ...
- 简单记录一下vue生命周期及 父组件和子组件生命周期钩子执行顺序
首先,vue生命周期可以用下图来简单理解 当然这也是官方文档的图片,详细的vue周期详解请参考这里 然而当同时存在父子组件的时候生命周期钩子是如何执行的呢? 请看下文: 加载渲染过程父beforeCr ...
- Windows10系统内置Linux
主要是在等电脑安装系统,有点慢,于是写个博客…… 还是那句话,从今年开始NOIP应该就不让用Windows了,所以还是尽早转Linux吧,不然NOIP考场上不会编译太尴尬对吧. 在学校电脑有Linux ...
- Django REST framework 之 认证 权限 限制
认证是确定你是谁 权限是指你有没有访问这个接口的权限 限制主要是指限制你的访问频率 认证 REST framework 提供了一些开箱即用的身份验证方案,并且还允许你实现自定义方案. 接下类我们就自己 ...
- 20175221曾祥杰 实验四《Android程序设计》
实验四<Android程序设计> 实验报告封面 课程:Java程序设计 班级:1752班 姓名:曾祥杰 学号:20175221 指导教师:娄嘉鹏 实验日期:2019年5月13日 实验时间: ...
- MVC Areas的使用
在网上查了一些资料 关于这个写的都很简单,没得实际应用. 参考了一下别人的代码,写篇博文记录一下. 首先目录结构: 然后主要是 BaseAreaRegistration 文件内容 public cla ...
- JSON.stringify方法报错：Converting circular structure to JSON
别以为JSON.parse(JSON.stringify(data))做深拷贝无敌,对于以下这种情况,当你需要保留父级对象,即 对象存在循环引用,就会报错. var a = [ { "id& ...
- Hook CreateProcess
6种比较常用的运行(执行)程序的方法: 包括WinExec.ShellExecute.CreateProcess.CreateProcessAsUser.CreateProcessWithLogonW ...