> 웹 프론트엔드 > HTML 튜토리얼 > 网页入门_html/css_WEB-ITnose

网页入门_html/css_WEB-ITnose

WBOY
풀어 주다: 2016-06-24 11:27:06
원래의
1112명이 탐색했습니다.

今天就是一个网页的入门,说实话我不太想当前端工程师。因为 那些东西 不会按照我的想法来实现对应的效果。我只想做一个大概。我想做后端开发。如果能是服务器端就很happy。如果能有 android的部分 就很happy。

 

然后现在就只是单单来写一些对应属性就好:

1、基本属性:

 字体标签,在里面对应可以写一些字体样式,颜色,大小的属性


回车换行

斜体字效果

下划线效果

202可以用来显示20的平方这样一个效果

H2O   可以用来显示水分子这样一个效果

删除线,或者称之为贯穿线

段落具有自动换行的属性,我们添加了一个 向左对齐的方式。

本段落居中对齐

网页入门_html/css_WEB-ITnose

 

2、超级链接

超级链接这个标签采用  anchor 锚点的意思代表 这里是一个链接操作,href是其中的属性,代表我们将会取得地方,这对标签之间可以添加对应的内容。

(1)文本链接

(2)图片链接

(3)页内链接

(1)

标签之间的内容如果是文本的话就是 文本链接

hello 

相册

说说

日志

留言板

个人中心

系统设置

(2)

标签之间的内容如果是图片的话就是 图片链接

网页入门_html/css_WEB-ITnose

(3)

页内链接,单击此链接回到当前页的对应位置

如果只是个#号就回到页面最顶端回到当前页最顶端

如果href后面跟了#号并且#后面是某一个标签儿元素的name的值,那么就会跳转到对应位置

 

3、Image与map的组合使用:

网页入门_html/css_WEB-ITnose

 

 

 

 

这是人家官方文档里面的例子,注意的是google chrome 和360 都不支持 只能用ie显示,我也不知道 我的ie的版本是多少。Wow!竟然是 11竟然是版本号 11.

 

 

这算是做成了老师没弄出来的东西。

 

4、滚动区域

同样的这个 属性在360里面被屏蔽了,不能显示,但是在ie里面是可以显示的。

滚动区域

这个属性老师讲解的还是 比较清楚。就不太多赘述了

直接复制一个靠谱的 示例就可以了

 ... 

移动文字! 

方向  #=left, right

啦啦啦,我从右向左移! 


啦啦啦,我从左向右移! 

啦啦啦,我从右向左移!

啦啦啦,我从左向右移!

方式  #=scroll, slide, alternate

啦啦啦,我一圈一圈绕着走! 


啦啦啦,我只走一次就歇了! 


啦啦啦,我来回走耶! 

 

5、列表

有序列表,无序列表。列表项。

注意层级嵌套关系就是了,这里不做过多讲述,等到创建一个电子笔记本的时候可以详细练习一下。

         

  • 水浒传
  •  

  • 三国演义
  •  

  • 西游记
  •  

  • 红楼梦
  •   

  

         

  1. 捉妖记
  2.  

  3. 港囧
  4.  

  5. 夏洛特烦恼
  6.  

  7. 等自己拍是
  8.   

  列表嵌套:

  

  中国省份:

  

         

  • 北京
  •  

        

  1. 海淀
  2. 朝阳
  3. 昌平
  4.  

 

  • 河北

        

         

    • 石家庄
    •    

    • 张家口
    •    

    • 保定

     

  •  

  • 河南
  •   

     

     

    6、表格

    利用它实在做过一些东西,这里面也不再过多赘述。

    cellspacing 是指单元格之间的距离

    celladding 是指单元格中的内容距离单元格边框的距离。

     

    Body中 内容顶格显示:

     采用topmargin的属性 并设置为0.

    관련 라벨:
    원천:php.cn
    본 웹사이트의 성명
    본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
    최신 이슈
    인기 튜토리얼
    더>
    최신 다운로드
    더>
    웹 효과
    웹사이트 소스 코드
    웹사이트 자료
    프론트엔드 템플릿