HTML5-块元素标签的使用



<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>块元素</title>
    <link rel="stylesheet" type="text/css" href="mycss.css">
    <!-- rel="stylesheet" type="text/css" href="mycss.css":指向外部样式表,类型,路径-->
    <style type="text/css">
        span{
            color: aqua;
        }
    </style>
    <!-- <span>:是一个文本容器-->
</head>
<body>
    <!-- 块-->
    <p>大家好!</p>
    <h1>块元素,以新行开始。</h1>
    <b>这是一个加重的标签</b>
    <a>内链标签</a>
    <div id="divid">
        <p>Hello jikexueyuan</p>
        <a>this is web page</a>
    </div>
    <div>
        <p><span>这是一个span的测试效果</span>标签外效果</p>
    </div>
</body>
</html>
CSS代码:mycss.css

#divid p{
    color:blueviolet ;
}

 
时间: 2024-10-18 02:37:24

HTML5-块元素标签的使用的相关文章

HTML5块元素标签的使用

<!DOCTYPE html> <html> <head lang="en">     <meta charset="UTF-8">     <title></title>     <link rel="stylesheet" type="text/css" href="mycss.css">     <style t

4.2 HTML5块元素标签的使用

1.HTML块元素块元素显示时,会以新行的形式显示.如:<h1><p><ul>(标题.段落.列表) 2.HTML内联元素内联元素显示时,不会以新行的形式显示.如:<b><a><img>(加重标签.超链接.图像) <div>元素是块元素,是各种元素的容器,其主要作用是用于样式的设计(为<div>标签指明id属性后,通过id属性进行样式的设计).(div在文档中定义一个节)<span>元素是内联元素,是

块级标签(行元素)和内联标签(行内元素)

块级标签 如果两个同样的标签写在一起,出现在不同的行上面,这种就是块级标签. 块级标签的特点: 占据整行,自带换行效果.除了div以外,一般块级标签都会有内外边距,宽度和高度. 常见的块级标签: <h1-h6></h1-h6>,<p></p>,<div></div> 块元素标签示例: <!DOCTYPE html> <html lang="en"> <head> <meta

HTML 5的革新之一:语义化标签一节元素标签。

摘至于:<HTML 5的革新——语义化标签(一)> 在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即使我们用css样式的id和class形容这块内容的意义).这些标签只是我们提供给浏览器的指令,只是定义一个网页的某些部分.但现在,那些之前没“意义”的标签因为因为html5的出现消失了,这就是我们平时说的“语义”. 看下图没有用div标签来布局 html5的布局 嗯,如上图那个页面结构没有一个div,都是采用html5语义标签(用哪些标签,关键取决于你的设计

Html5学习笔记1 元素 标签 属性

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>HTML5学习笔记</title> </head> <body bgcolor="#90ee90"> 1.Html5的元素<br/><br/> 元素指的是从開始标签到结束标签的全部代码<

[HTML5]块和内联元素的嵌套

块元素可以包含块或内联元素,但是内联元素只能包含其他内联元素. <!-- 无效代码! :-( --> <strong> <p>你不应该把p元素放在 "strong" 标签中.</p> </strong> strong:内联元素. p:块元素. 虽然html(超文本标记语言)规范是这么约定的,但实际这样是有效的,可以被浏览器解析. a标签,链接是唯一的例外,它是内联元素,也可以嵌套块元素,但要注意不要a标签嵌套a标签,这样的代码

P标签特性:不能嵌套块元素

一直以为P标签只是个自带上下外边距的块元素,最近在项目里利用其自带外边距就嵌套了个div包裹的按钮兰到里面.在测试时发现这个P标签被解析成了2套P标签,工具栏被插在2组P标签中间属于同级了. 后经过查询发现,原来P元素是不能包含块级元素(包括P自身)的.The P element represents a paragraph. It cannot contain block-level elements (including P itself).

HTML中为何p标签内不可包含div标签?那哪些块元素里面不能放哪些块元素呢?

先看下面的例子你就能明白两者的差别: <p>测试一下块元素与<span>内联元素</span>的差别</p> <p>测试一下<div>块元素</div>与内联元素的差别</p> 在上面的例子中,<div>会自己产生一个新的行,而<span>并没有换行,这是在没有CSS渲染的情况下才这样,同样,我们也可以通过CSS把div定义成内联元素,把span定义成块元素,但是,我们却不能在HTML里

HTML中为何P标签内不可包含块元素?

起因:在做项目时发现原本在DW中无误的代码到了MyEclipse6.0里面却提示N多错误,甚是诧异.于是究其原因,发现块级元素P内是不能嵌套DIV的. 深究:我们先来认识in-line内联元素和block-line块元素,因为HTML里几乎所有元素都属于内联元素或者块元素中的一种. in-line这个词有很多种解释:内嵌.内联.行内.线级等,但是,它们都是表示相同的意思,在这里我们选择习惯的叫法–内联. 先看下面的例子你就能明白两者的差别: <p>测试一下块元素与<span>内联元

HTML————行级元素和块级元素标签

块级标签:(block) 1.独占一行,不和其他元素待在同一行,宽度自动填满父元素宽度 2.能设置weight(宽).height(高)属性 3.可以设置margin,padding属性 常见的块级标签: <address>,定义地址 <caption>,定义表格标题 <div>,定义文档中的分区或节 <dl>,定义列表 <dt>,定义列表中的项目. <fieldset>,定义一个框架集 <form>,创建HTML表单 &