为 HTML 添加新元素

该实例向 HTML 添加的新的元素，并为该元素定义样式，元素名为 <myHero> ：

实例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
  <title>为 HTML 添加新元素</title>
  <script>document.createElement("myHero")</script>
  <style>
  myHero {
    display: block;
    background-color: #ddd;
    padding: 50px;
    font-size: 30px;
  } 
  </style> 
</head>

<body>

<h1>我的第一个标题</h1>

<p>我的第一个段落。</p>

<myHero>我的第一个新元素</myHero>

</body>
</html>

为HTML5添加新样式标签的更多相关文章

  1. HTML5 添加新的标签 input属性

    <!-- 新增 有语意标签 --> <nav></nav> <!-- 导航标签 --> <seclion></seclion> ...

  2. HTML5的新结构标签

    在之前的HTML页面中,大家基本上都是用了Div+CSS的布局方式.而搜索引擎去抓取页面的内容的时候,它只能猜测你的某个Div内的内容是文章内容容器,或者是导航模块的容器,或者是作者介绍的容器等等.也 ...

  3. 学习HTML5之新特性标签一览（详细）

    HTML5又2008年诞生,HTML5大致可以等同于=html+css3+javascriptapi.... so --->支持css3强大的选择器和动画以及javascript的新的函数 先来 ...

  4. 让低版本IE支持Html5的新语义标签

    HTML5能为我们做的事儿很多,最为可口的就是语义化标签的应用,如果你已经在Chrome或者其他支持HTML5的浏览器上用过它的牛x,那这篇文章对你一定有用,因为现在你也可以在IE上用到HTML5. ...

  5. HTML5添加 video 视频标签后仍然无法播放的解决方法 IIS添加MIEI类型

    现象:插入如下代码后仍然无法看视频(注:视频已确认为浏览器支持格式) <video controls="controls" width="500px" h ...

  6. css_input[checked]复选框去掉默认样式并添加新样式

    效果对比: “\2713”实体符号√ :如有兴趣查看详细实体符号请点这里 代码实现: <!DOCTYPE html> <html> <head> <meta ...

  7. HTML5学习之新增标签

    转自:http://www.cnblogs.com/fly_dragon/archive/2012/05/25/2516142.html 作者:FlyDragon 一.引言 在本节中,笔者将向大家讲述 ...

  8. HTML5的新的结构元素介绍

    HTML5的新的结构元素介绍 一.HTML5与HTML4的区别 1. 取消了一些过时的HTML4的标签 其中包括纯粹显示效果的标记,如<font>和<center>,它们已经被 ...

  9. HTML5的新特性：范围样式，又叫做<style scoped>

    Chromium 最近实现了一个HTML5的新特性:范围样式,又叫做<style scoped> .开发者可以通过为根元素设定一个添加了scoped属性的style标签,来限制样式只作用于 ...

随机推荐

  1. vscode 中 eslint 的配置

    上个博客说到了如何配置 eslint 和 editorconfig, 但是每次运行项目的时候才能知道哪段代码不符合规范,确实也有点蛋疼. 那么能不能直接在编辑器中就能看到不符合规范的代码的呢??? 这 ...

  2. 经典数学问题<手电过河问题>的动态解法--问题规模扩展至任意大小

    非常有趣的一件事是今天在TopCoder的1000分题里面发现了这道经典数学问题. Notes           -                   In an optimal solution ...

  3. POJ1226 Substrings ——后缀数组 or 暴力+strstr()函数 最长公共子串

    题目链接:https://vjudge.net/problem/POJ-1226 Substrings Time Limit: 1000MS   Memory Limit: 10000K Total ...

  4. BZOJ 3624 [Apio2008]免费道路：并查集 + 生成树 + 贪心【恰有k条特殊路径】

    题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=3624 题意: 给你一个无向图,n个点,m条边. 有两种边,种类分别用0和1表示. 让你求一 ...

  5. Es6 学习笔记（一）数组扩展

    扩展运算符 ... 1.数组的扩展运算符将一个数组转换成一个逗号分隔的参数序列 console.log(...[1,2,3])   //1,2,3 ['a', 'b',...[1,3]]   //a, ...

  6. mysql八：ORM框架SQLAlchemy

    阅读目录 一 介绍 二 创建表 三 增删改查 四 其他查询相关 五 正查.反查 一 介绍 SQLAlchemy是Python编程语言下的一款ORM框架,该框架建立在数据库API之上,使用关系对象映射进 ...

  7. 递归/非递归----python深度遍历二叉树（前序遍历，中序遍历，后序遍历）

    递归代码:递归实现很简单 '二叉树结点类' class TreeNode: def __init__(self, x): self.val = x self.left = None self.righ ...

  8. ACM学习历程—Hihocoder 1164 随机斐波那契（数学递推）

    时间限制:5000ms 单点时限:1000ms 内存限制:256MB 描述 大家对斐波那契数列想必都很熟悉: a0 = 1, a1 = 1, ai = ai-1 + ai-2,(i > 1). ...

  9. BZOJ1453：[WC]Dface双面棋盘

    浅谈树状数组与线段树:https://www.cnblogs.com/AKMer/p/9946944.html 题目传送门:https://lydsy.com/JudgeOnline/problem. ...

  10. bzoj 3501 PA2008 Cliquers Strike Back —— 贝尔数

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=3501 用贝尔三角预处理贝尔数,拆模数并在 \( p \) 进制下使用公式,因为这样每次角标增 ...