首页 > 编程语言 > 详细

Java-JavaWeb-CSS

时间：2018-09-05 23:51:04 阅读：184 评论：0 收藏：0 [点我收藏+]

标签：选择 javaweb 选择器样式作用 absolute 层叠样 abs ext

层叠样式表
CSS和HTML相结合的4种方式
- 每个html标签，都有一个style属性
  - <div >......</div>
  - 属性与值之间使用冒号：连接
  - 属性与属性之间使用分号；连接
- 使用HTML的<style>标签，要写在<head>标签中
  - <style type="text/css">
    - div{
      - color:red;
    - }</style>
- @import url(CSS文件的路径);
  - 也要写在head标签中style标签中
  - css文件的格式
    - div{color:black;}
  - 某些浏览器中不支持
- 头标签的link标签
  - <link rel="stylesheet" type="text/css‘ href="div.css"/>
  - 此种方式较常用
选择器
- class选择器
  - <style> .haha={color:black;}</style>
    - 所有class属性值是haha的标签，都会起作用
  - <div class="haha">....</div>
- id选择器
  - <style> #haha={color:black;}</style>
    - 所有id属性值是haha的标签都会起作用
  - <div id="haha">....</div>
- 选择器的优先级
  - class选择器大于标签选择器，id选择器大于class选择器，单独标签中的style属性的优先级最高
- 扩展选择器
  - 关联选择器
    - <div><p>xxx</p></div>
    - 要设置div标签里的p标签的样式使用：
      - div p {xxx}
  - 组合选择器
    - 将两个不同的标签设置相同的样式
      - div,p {xxx}
  - 伪元素选择器
    - 利用CSS中已有的样式
      - 如超链接，有原始状态，悬停，点击，已点击等状态
      - 在头标签的style标签中定义以下即可
        
        a:link{ }
        
        a:hover{ }
        
        :active{ }
        
        :visited{ }
CSS的盒子模型
- div+CSS
  - 属性：
    - border
      - 边框
    - padding补白
      - 内边距（文本内容与边框的间距）
    - margin
      - 外边距
    - float
      - 值：left表示文本流向对象的右边
      - 不常用
    - position
      - 值：
        
        absolute
        
        将对象从文档流中拖出，会飘在上边一层
        
        可以通过top\left属性，调整div的位置
        
        relative
        
        不会将对象从文档流中拖出
        
        同样可以使用top\left属性调整位置

Java-JavaWeb-CSS

标签：选择 javaweb 选择器样式作用 absolute 层叠样 abs ext

原文地址：https://www.cnblogs.com/wonewo/p/9595216.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行

友情链接

兰亭集智国之画百度统计站长统计阿里云 chrome插件新版天听网

关于我们 - 联系我们 - 留言反馈

迷上了代码！