HTML与CSS初探

一、HTML基本标签

图像标签

<img src="图像的路径"alt="提示文字"width="图像宽的像素(px)"height=“图像宽的像素(px)”>

名称标签示例
标题标签<h1>~<h2>~~<h6><h1>静夜思</h1>
断落和换行标签<p>~~~</p>、<br/><p>床前明月光<br/>疑是地上霜</p>    br强制换行
水平线标签<hr/><hr/>
斜体<em>~~~</em><em>举头望明月</em>
字体加粗<strong>~~~</strong><strong>低头思故乡</strong>

还有:

自动刷新本页面<meta http-equiv="refresh" content="30">
将一段文本中的“代码”部分作区别于文本其他部分的显示<code>  <pre>标签,与<code>主要搭配使用。
  


二、HTML的注释和特殊符号

 

特殊符号字符实体实例
空格&nbsp;<a href="#">百度</a>&nbsp;  注意不能少了末尾的分号
大于号(>)&gt;如果时间&gt;晚上6点,就坐车回家
小于号(<)&lt;如果时间&lt;早上7点,就走路去上学
引号(")&quot;W3C规范中,HTML的属性值必须用成对的&quot;引起来
版权符号@&copy;&copy;2003-2013北大青鸟



三、HTML5的媒体元素

1、视频元素

     

<video src="视频路径" controls> </video> (浏览器可能不支持)

(controls:提供播放、暂停和音量的控件;autoplay:自动播放)

<video controls autoplay>
 <source src="视频路径.mp4"  type="类型说明"/>
 <source src="视频路径.webm"  type="类型说明"/>

</video>


2、音频元素

(controls:提供播放、暂停和音量的控件;autoplay:自动播放)

<audeo controls>
     <source src="音频路径.mp3"  type="audeo/mpeg"/>
     <source src="音频路径.ogg"  type="audeo/ogg"/>
</audeo>




四、HTML5的结构元素


元素名描述
header标题头部区域的内容(用于页面或页面中的一块区域)
footer标记脚部区域的内容(用于整个页面或页面的一块区域)
sectionWeb页面中的一块独立区域
article独立的文章内容
aside相关内容或应用(常用于侧边栏)
nav导航类辅助内容

五、CSS选择器


5.1  内联样式表   

  <style>.......</style>

(注:一般在头部head范围内定义style来设置下面的格式

(CSS注释:/* */)

 

    1)标签选择器

    <style>

                h1{                                         //标签

                font-size:20px;                   //属性,值

                color:red;

                }

        </style>

        使用:<h1>床前明月光</h1>   :直接引用


        

        2)类选择器

        <style>                                                                           

                .red{                         //创建一个类选择器

                color:blue;

                }

        </style>

        使用: <h1 class="red">床前明月光</h1>  :标签后调用类名可引用, 可重复引用


        3)ID选择器

         <style>                                                                           

                #greed {                         //创建一个ID选择器

                color:greed;

                }

        </style>

 使用: <p id="greed">床前明月光</p> :标签后调用ID名可引用  但ID必须唯一,不能重复


 

    <p style="color=yellow;">文本内容</p>

5.2 外部样式表

    在外部创建一个css文件,把样式在头部head范围内导入到这个文件中  

    <link rel="stylesheet" href="该样式文件路径"/> 

   在页面前加载


5.3 导入样式表

  import,在页面后加载

  有些浏览器不支持,不常用。


六、超链接

 

1.几个页面之间的跳转:

<a href="链接地址的路径" target="目标窗口位置">文本或图像</a>

(注:target=“_self”在自身窗口内  或  target=“_blank”新建窗口打开


2.锚链接:

    1)  跳转到同一个页面的固定位置

                     <a href="#me" >文本</a>

                     <a name="me" >文本</a>   (注:给标签一个代号标记,即命名)

     2)  跳转到不同页面:

                  <a href="2.html#me" >文本</a>    

                  <a name="me" >文本</a>   (注:给标签一个代号标记,即命名)

3.功能连接:

                    <a href="mailto:邮箱地址" >写信</a>
阅读更多
文章标签: HTML CSS
个人分类: HTML CSS
想对作者说点什么? 我来说一句

html_lh_2.24

2010年02月24日 2.44MB 下载

没有更多推荐了,返回首页

不良信息举报

HTML与CSS初探

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭