html及css部分

html及css部分

HTML表格

  1. table 行 列
  2. 边框 border
  3. 表头(表头显示粗体居中)
  4. 跨行跨列(th中设置colspan rowspan实现)
  5. Cellspacing单元格间距
  6. caption表格标题
  7. cellpadding表格边距是内容离边边的距离
  8. cellspacing表格间距是两个边框间的距离,设置为零时候为单线框
  9. 不设置border或设为零,无边框

HTML表单

  1. 类型:text,下拉列表,单选框,复选框,
  2. 标签类型,Form.
  3. 输入元素时,使用input,在input的Type.中定义类型。
    ① 文本域,Text.
    ② 密码字段,Password.
    ③ 单选按钮,radio Name相同,Value中设置类别
    ④ 复选框,Checkbox.,name相同,
    Size为显示出来的个数
    Selected默认选中的
    Multipler多选按住ctrl
    ⑤ 提交按钮,Submit. 在action中(form中),设置所传输到的页面,
    提交
    ⑥ 下拉按钮select,带有预选
    html及css部分_第1张图片
    ⑦ 发送电子邮件
    点击按钮后发送至someone的邮箱
    Palacehorder里边的默认字体
    ⑧ Texture多行输入文本框行列可以设置

CSS table

  1. 可以指定表格的th td的属性(table,th,td{})th td都设置边框后会有双重边框,故采用折叠边框border-collapse设置collapse设置单边框
  2. html及css部分_第2张图片
  3. 设置垂直对齐(顶部底部中间)vertical-align

CSS伪类

  1. 添加一些选择器的特殊效果
  2. a:link/visited/hover/active激活点着不松手
    顺序需要固定写静态伪类
    动态伪类文本框等所有标签 focus选中,hover,active
  3. 与css类配合使用
  4. First-child选择父类的第一个子元素仅对第一个该类显示该效果
    例如
    html及css部分_第3张图片
  5. p:first-child i
    { color:blue; }
    选择到第一个p下的所有i
  6. 分组选择器,用逗号隔开
  7. 嵌套选择器.marked p{} marked下的p
    P.marked
    Line-height行高默认为110-120%
    Height元素高度

CSS伪元素

1.first-line 第一行
first-letter 首字母(首字变大font-size:xx-large)
3. 结合css类
4. 多个伪元素可以共同作用
5. Before,after在元素内容的前(后)插入
例如内容图片

另。

CSS表单

对表单的渲染首先
input[type=text], select{} input[type=submit]:hover基本格式

  1. 设置 box-sizing 属性为 border-box确保浏览器呈现出带有指定宽度和高度的输入框是把边框和内边距一起计算进去的
  2. 聚焦效果fucus点击text是会变色
    例如 input[type=text]:focus {
    background-color: lightblue;
    }
  3. 输入框中设置图标
    使用 background-image 属性和用于定位的background-position 属性

你可能感兴趣的:(html及css部分)