美文网首页
标签<span>

标签<span>

作者: 小小的叶子随枫飘落 | 来源:发表于2017-01-21 18:43 被阅读28次
1、span是一个in-line元素,翻译为内联元素。它的特点是不会独占一行。它和块(block)级元素是相对的,块级元素是独占一行的。比如你在网页中的某个位置加入一些文字,最好用span将文字包含起来,这样你在想取到这段文字的时候,就可以先取到该span,然后再取span.innerhtml来得到文字
45B29721-5969-4AFE-B3E1-03DEB0E20529.png
2、HTML5 <datalist> 元素

<datalist> 元素为 <input> 元素规定预定义选项列表。
用户会在他们输入数据时看到预定义选项的下拉列表。
<input> 元素的 list 属性必须引用 <datalist> 元素的 id 属性。

<!DOCTYPE html>
<html>
<body>

<form action="action_page.php">

<input list="browsers" name="browser">
<datalist id="browsers">
  <option value="Internet Explorer">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>
<input type="submit">
</form>

<p><b>注释:</b>Safari 或 IE9(以及更早的版本)不支持 datalist 标签。</p>

</body>
</html>
3、<input> 元素的输入类型

<input type="text"> 定义供文本输入的单行输入字段
<input type="password"> 定义密码字段
<input type="submit"> 定义提交表单数据至表单处理程序的按钮
<input type="radio"> 定义单选按钮
<input type="checkbox"> 定义复选框
<input type="button> 定义按钮
<input type="number"> 用于应该包含数字值的输入字段
表单(Form)是HTML的一个重要部分,主要用于采集和提交用户输入的信息。

4、
FD58ABFB-A670-4417-AC11-9B015B1194A8.png
5、CSS 选择器
  • 1、 CSS 后代选择器:在后代选择器中,规则左边的选择器一端包括两个或多个用空格分隔的选择器。选择器之间的空格是一种结合符(combinator)。每个空格结合符可以解释为“... 在 ... 找到”、“... 作为 ... 的一部分”、“... 作为 ... 的后代”,但是要求必须从右向左读选择器
h1 em {color:red;}
<h1>This is a <em>important</em> heading</h1>
<p>This is a <em>important</em> paragraph.</p>
  • 2、CSS 子元素选择器:如果您不希望选择任意的后代元素,而是希望缩小范围,只选择某个元素的子元素
h1 > strong {color:red;}
  • 3、CSS 相邻兄弟选择器:如果需要选择紧接在另一个元素后的元素,而且二者有相同的父元素,可以使用相邻兄弟选择器(Adjacent sibling selector)
h1 + p {margin-top:50px;}
  • 4、id 选择器:id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。
    id 选择器以 "#" 来定义。
#red {color:red;}
<p id="red">这个段落是红色。</p>
<p id="green">这个段落是绿色。</p>
  • 5、CSS 类选择器:在 CSS 中,类选择器以一个点号显示
.center {text-align: center}
  • 6、属性选择器:对带有指定属性的 HTML 元素设置样式。
    可以为拥有指定属性的 HTML 元素设置样式,而不仅限于 class 和 id 属性。
    注释:只有在规定了 !DOCTYPE 时,IE7 和 IE8 才支持属性选择器。在 IE6 及更低的版本中,不支持属性选择。
input[type="text"]
{
  width:150px;
  display:block;
  margin-bottom:10px;
  background-color:yellow;
  font-family: Verdana, Arial;
}

input[type="button"]
{
  width:120px;
  margin-left:35px;
  display:block;
  font-family: Verdana, Arial;
}
6 clear 属性规定元素的哪一侧不允许其他浮动元素。

相关文章

  • <span>标签

    这一小节讲解 标签,我们对 、 、 这三个标签进行一下总结: 1. 和 标签是为了强调一段话中的关键字时使用,它们...

  • 标签<span>

    1、span是一个in-line元素,翻译为内联元素。它的特点是不会独占一行。它和块(block)级元素是相对的,...

  • HTML<span>标签

    一.定义和用法 标签被用来组合文档中的行内元素 二.提示和注释 提示:请使用 来组合行内元素,以便通过样式来格式化...

  • <div>和<span>标签的异同

    和 都是我们常见的标签,从应用中看二者并无区别,它们都能划分出单独的区域,以便我们为单独的一块区域设置样式。但是二...

  • HTML 4.01版

    复习 排版标签:p hr br pre 字体标签: 转义字符:<> 清单标签:有序列表...

  • 2019-03-20第二天

    常用的标签有 标题标签H系列 段落标签p系列 换行标签br 横线标签hr 常用的实体有<<>> © 空...

  • 2019-05-27第二天

    常用的标签有 标题标签H系列 段落标签p系列 换行标签br 横线标签hr 常用的实体有<<>> © 空...

  • <div> 和 <span>

    HTML 块元素 大多数 HTML 元素被定义为块级元素或内联元素。 编者注:“块级元素”译为 block lev...

  • 第二篇

    2.在HTML里打多个空格需要使用标签,一般标签有<;=<,> => =空格回车标签有...

  • jQuery html函数

    jQuery 的html()函数自动把不安全的标签 标签和&符号escape了 script标签被转换成 & lt...

网友评论

      本文标题:标签<span>

      本文链接:https://www.haomeiwen.com/subject/utbvbttx.html