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

html&scc基础知识

时间:2017-06-25 17:51:20      阅读:427      评论:0      收藏:0      [点我收藏+]

标签:readonly   选中   class选择器   语言   tar   而且   field   span   分布   

html

常用基础标签

带有语义的标签

  • em,强调
  • strong ,比em强调级别更高
  • abbr,定义缩写,与title属性相互搭配使用
  • address,定义地址元素
  • blockquote,定义块引用,通常情况下会产生缩进
  • cite,通常情况下,某段话引子某本书,可以使用cite进行说明
  • ins,定义被插入文本
  • del,定义被删除文本

带有一定样式的标签

  • b,定义粗体文本
  • i,定义斜体文本
  • big,定义大号文本
  • small ,定义小号字体文本
  • sup,上标文本
  • sub,下标文本
  • bdo,定义文本显示方向,属性:dir,值,ltr,rtl

输出类标签

  • pre,代码中样式原样输出
  • code,定义计算机代码文本
  • kbd,定义键盘文本
  • var,定义变量

功能类标签

a标签

  • 定义超链接实现页面跳转
  • 定义锚点实现书签功能

列表

  • 无序列表 ul,li
  • 有序列表 ol,li

页面嵌套

  • iframe

图片

  • 了解即可

表格

  • 表格标题 caption 标签
  • 表格页眉 th 标签
  • 表格的行 tr 标签
  • 表格的单元格 td 标签
  • 表格的头部 thead 标签
  • 表格的主干 tbody 标签
  • 表格的尾部 tfoot 标签

*页面所有链接的基础链接

  • 标签(位于head标签内部)

表单

输入域<input>:

  • type属性:button,file,hidden,text,password,radio,checkbox,image,reset,submit.
  • 其他属性了解即可

文本输入区<textarea>:

  • cols属性,规定可见列数
  • rows属性,规定可见行数
  • disabled属性,禁用当前文本输入区
  • name属性,当前文本区的名字
  • readonly属性,当前文本区域只读

按钮:

  • disabled属性,禁用此按钮
  • name属性,按钮名字
  • type属性,按钮类型
  • value属性,按钮上显示文本内容的默认值

下拉菜单

表单中的标记<label>

表单中相关元素分组<fieldset>

css

什么是CSS

层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。

CSS的使用方式

  1. 内联样式,也称行内样式,写在标签内的样式,只影响该标签内的元素。适合范围,除<script>外的所有子标签。
  2. 内部样式,定义在style标签中,放在head标签中,设置的样式可以影响整个HTML页面。
  3. 外部样式,将CSS样式编写并安放在一个独立的.css文件内。

CSS基础选择器

  • html选择器:
    通过html标签名来选择元素:
      1. 所有的html标签都可以当做选择器
      2. 无论标签藏多深都会被选中
      3. 选择的是所有的标签而不是具体某个标签。所以说我们通过html标签选择器来设置的都是一些共性问题。

  • class选择器:
      1.任何的标签都可以有id属性和属性值(因为id是一个全局属性)。id命名不能随意的命名。大小写敏感 ,id的名字中可以有数字字母下划线,但是要以字母开头。
      2.但是id名不能够重复

  • id选择器:
       1.任何的标签都可以使用class属性(class属性也是一个全局属性)
       2.class属性名可以重复使用
       3.一个class属性中,可以有多个class属性值。

块级元素和行内元素

概念

  • 块级元素:是指块级框从上到下一个接一个地排列,框之间的垂直距离是由框的垂直外边距计算出来。例如<div>标签。
  • 行内标签:可以在同一行内分布。如<span>标签。

两种元素的区别

  1. 行内元素部不能够设置宽度和高度。行内元素的宽度和高度是标签内容的宽度和高度。块级元素可以设置宽度和高度。
  2. 块级元素会独占一行。而行内元素却部能够独占一行,只能和其他的行内元素共用一行。
  3. 如果块级元素不设置宽度,那么块级元素会自动的沾满父元素的全部宽度。

块级元素和行内元素的转换

使用display属性进行转换。如下:

display:block ,inlin-block

综合选择器

  • 后代选择器:div p
  • 焦急选择器:h3.test
  • 并级选择器:div,p
  • 子(直系儿子)元素选择器:div>p
  • 序列选择器:ul li:first-child ul li:last-child
  • 相邻兄弟选择器:div+p
  • 普通兄弟选择器:div~p

CSS的继承性和层叠性

  • CSS的某些样式是具有继承性的,那么什么是继承呢?继承是一种规则,它允许样式不仅应用于某个特定 html 标签元素,而且应用于其后代。比如下面代码:如某种颜色应用于 p 标签,这个颜色设置不仅应用 p 标签,还应用于 p 标签中的所有子元素文本,这里子元素为 span 标签。
  • 层叠就是在html文件中对于同一个元素可以有多个css样式存在,当有相同权重的样式存在时,会根据这些css样式的前后顺序来决定,处于最后面的css样式会被应用。
  • 权重问题: 通用选择器(*) < 元素(类型)选择器 < 类选择器 < 属性选择器 < 伪类 < ID 选择器 <内联样式

注释:!important 能够把"单独属性"的权重变为无限大。 尽量少用。

html&scc基础知识

标签:readonly   选中   class选择器   语言   tar   而且   field   span   分布   

原文地址:http://www.cnblogs.com/Tsukasaa/p/7077133.html

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