zoukankan      html  css  js  c++  java
  • 前端课堂第三课

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title></title>
    </head>
    <body>
    css
    层叠样式表 修饰网页的

    css的语法
    1.行内样式的语法
    2.内部样式表和外部样式表的语法

    css的使用方式
    1.行内样式
    2.内部样式表
    3.外部样式表
    4.外部导入样式

    css选择器
    ID选择器
    class选择器
    标签选择器
    组合选择器
    子代选择器
    后代选择器
    通用选择器
    伪类选择器 :hover鼠标悬浮上去的样式

    css样式的优先级
    1.根据权重来确定
    2.如果权重相同,就近原则(后定义原则)

    权重:仅仅只是一个参考的值,并没有实际的含义
    内联 1000
    id 100
    class 10
    伪类 10
    标签 1
    通用 0
    !important 只要出现就以这个为主
    注意:计算权重的时候不需要去管子代、后代。直接加起来就OK

    颜色的三种表示方法
    1.颜色英文单词
    2.16进制
    3.rgb 扩展 rgba

    文本类样式
    color
    line-height 得确定里面有几行
    text-align 对齐方式
    text-decoration 下划线
    font-size 字体大小
    font-style 字体风格(倾斜...)
    font-family 字体样式(宋体...)
    font-weight 字体加粗

    元素的显示方式
    display
    inline 行内元素
    inline-block
    block
    none 隐藏

    元素的隐藏
    visibility:hidden

    轮廓
    主要用在input标签中,只需要清空即可
    列表
    list-style:none 即可
    鼠标的样式
    cursor
    透明度
    opacity: 0.1; 取值:0-1之间 可以为0和1 0表示全透,1表示全不透
    rgba(255,0,0,0.1)

    </body>
    </html>

    提问1 :display:none  和 visibilityhidden两者的区别?

    答:如果给一个元素设置了display: none,那么该元素以及它的所有后代元素都会隐藏,它是前端开发人员使用频率最高的一种隐藏方式。隐藏后的元素无法点击,无法使用屏幕阅读器等辅助设备访问,占据的空间消失。 

    用法 :<p style=”display:none”>B元素</p>

             给元素设置visibility: hidden也可以隐藏这个元素,但是隐藏元素仍需占用与未隐藏时一样的空间,也就是说虽然元素不可见了,但是仍然会影响页面布局。

    用法:<p style=”visibility:hidden”>B元素</p>

    表单:

    文本框:type=”text”

    单选:type=”radio”

    多选:type=”checkbox”

    下拉:

    <select>

                       <option >

                      

                       </option >

             </select>

    多行多列段落文本框  <Textarea name=””  rows=””  cols=””>

    Position:absolutely   绝对定位

    Position:relative     相对定位

  • 相关阅读:
    Python虚拟开发环境pipenv
    挖矿木马的应急响应
    熟悉使用ConfigParser库读写配置文件
    Django的RestfulAPI框架RestFramework
    使用DnsCat反弹shell
    使用mimikatz获取和创建Windows凭据的工具和方法
    拿下主机后内网的信息收集
    iOS 新浪微博-5.0 首页微博列表
    xcode 各版本下载地址及其它工具下载地址
    iOS 新浪微博-4.0 OAuth授权
  • 原文地址:https://www.cnblogs.com/huayong/p/10947020.html
Copyright © 2011-2022 走看看