码迷,mamicode.com
首页 > Web开发 > 详细

HTML主要标签应用

时间:2018-06-02 21:33:19      阅读:201      评论:0      收藏:0      [点我收藏+]

标签:单词   描述   大小   灰色   表示   w3c   color   自带   属性   

 HTML属性

  属性一般描述于开始标签

  属性总是以名称/值对的形式出现,比如:name="value"。

HTML颜色

  1、英文单词表示。 red、green

<p style="color:red">红色</p>

  216进制代码 (0-f),用“#”加六位16制代码表示。 例如:#cccccc(相同可简写#ccc)、#000000#000

<h1 style="color:#cccccc">灰色</h1>

  3、rgba0~255,0~255,0~255,0~1),四位数表示。其中0~255代表颜色,0~1代表透明度。

 

<h1 style="color:rgba(255,0,0,0.5)>红色</h1>

 

 

HTML路径

绝对路径:从根开始找,电脑磁盘路径

 列如:E:\workspace\0601\html

相对路径:从自身位置开始找

同级文件夹 ./ (可省略)

上一级文件夹   ../

下一级文件夹   ./

 

HTML实体

HTML 中的预留字符必须被替换为字符实体。

一些在键盘上找不到的字符也可以使用字符实体来替换。

如需显示小于号,我们必须这样写:&lt; 或&#60;  空格: &nbsp; 

 

 

<a>标签

  <a href=""></a>

 

  <a> 标签定义超链接,用于从一个页面链接到另一个页面。

 

   自带 href 属性,它指定链接的目标。

 

 

      1、页面跳转

 

      <a href="网址">内容</a>-----注意网址的完整性

 

<a href="http://www.baidu.com"> 百度链接</a>

 

 

      重要属性 target ,打开方式设定,默认在当前页打开,属性值:_blank 跳转页面打开

 

     2、定位

 

      设置锚点

 

  在要定位到的位置 找一个标签给他加id属性 属性值就是锚点名称

 

      点击链接直接到定位锚点

<a href="#xx">定位</a>
...
<p id=xx>定位处内容</p>

 

   3、下载。其他

 

   <a>标签跳转到的文件,格式浏览器打不开,则提供下载,例如:.zip、.rar等压缩包

 

 

 <iframe>标签   窗口框架

 

   在网页页面内放置另外页面

<iframe src="http://www.w3cschool.cc/"></iframe>

 

 

<img>标签

 

<img> 标签定义 HTML 页面中的图像。

 

<img> 标签有两个必需的属性:src 和 alt。

src图片位置、路径;alt,表示图片大小,width和height可只写一个,保持图片原比例。

<img src="123.gif" alt="Smiley face" width="150" height="150">

 

 

列表标签<ol>、<ul>、<li>

 

  <ol>与<ul>的内容只能是<li>,其他所有标签、内容,需要嵌套在<li>里面。

 

有序列表<ol>

 

<ol type=”形式”>


  <li>内容</li>


  <li>内容</li>


  <li>内容</li>


</ol>

 

无序列表用<ul>

<ul>


  <li>内容</li>


  <li>内容</li>


  <li>内容</li>


</ul>

自我学习问题:

1、字体颜色设置,可以用<span>,复制style属性

<span style=color:blue> </span>

不能单读一行,可用<br>断行

一段文字中只需要几个字变色时,可以嵌套在<p></p>中

<p>内容1
   <span style=“color:blue”>内容2 </span>
     内容3
</p>

 

2、起文件名尽量,不要有中文

3、注意代码格式的书写,美观

4、注释符号<!--     -->

 

HTML主要标签应用

标签:单词   描述   大小   灰色   表示   w3c   color   自带   属性   

原文地址:https://www.cnblogs.com/dk2557/p/9125952.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!