当前位置: 首页 > news >正文

银行门户网站是什么意思网页设计代码中字体的颜色如何改

银行门户网站是什么意思,网页设计代码中字体的颜色如何改,合作做网站,微信公众号开店流程本文为个人学习总结,如有谬误欢迎指正。前端知识众多,后续将继续记录其他知识点! 目录 前言 一、列表(下面属性用于ul ol li) 不同的列表项目标记—list-style-type 定位列表项标记—list-style-position 图像作为…

本文为个人学习总结,如有谬误欢迎指正。前端知识众多,后续将继续记录其他知识点!

目录

前言

一、列表(下面属性用于ul ol li)

不同的列表项目标记—list-style-type

定位列表项标记—list-style-position

图像作为列表项标记—list-style-image

简写—list-style(type-position-image)

二、表格

边框相关(其他元素也能用)—border

独有的属性(只有table能用)

三、背景—background

background-image 属性指定用作元素背景的图像。

background-repeat 属性在水平和垂直方向上都重复图像(默认)

background-position 属性用于指定背景图像的位置

​编辑background-attachment 属性指定背景图像是应该滚动还是固定的(不会随页面的其余部分一起滚动)


前言

在网页设计与开发的世界里,如何清晰、美观地呈现信息是核心课题之一。列表能够让繁杂的内容条理分明,表格可将数据有序排列,而背景则能为页面增添氛围与层次感,它们共同构成了网页信息展示的重要基石。掌握列表的样式设置、表格的边框与内容处理以及背景的图像与属性调控,不仅能让网页更具专业性,还能极大提升用户的浏览体验。希望这份笔记能为同样正在学习CSS的同学提供参考,也欢迎大家结合原课程视频深入学习,共同进步。

网课链接: https://www.bilibili.com/video/BV1p84y1P7Z5/?share_source=copy_web&vd_source=faad59aa4025692c65fca19bc4320e39


一、列表(属性用于ul ol li)

不同的列表项目标记—list-style-type

list-style-type 属性指定列表项标记的类型。

此属性值;

  • none:没有列表标记(常用)
  • square:方形
  • circle:空心圆
  • lower-roman:小写罗马数字
  • upper-alpha:大写字母
  • decimal:小写阿拉伯数字(样式看起来是有序表)
  • 有些用于有序表,有些用于无序表

定位列表项标记—list-style-position

list-style-position 属性指定列表项标记(项目符号)的位置。

"list-style-position: outside;" 表示项目符号点将在列表项之外。列表项每行的开头将垂直对齐。这是默认的:

"list-style-position: inside;" 表示项目符号将在列表项内。由于它是列表项的一部分,因此它将成为文本的一部分,并在开头推开文本:

图像作为列表项标记—list-style-image

list-style-image 属性将图像指定为列表项标记:

使用url("文件路径")

简写—list-style(type-position-image)

list-style 属性是一种简写属性。它用于在一条声明中设置所有列表属性(书写时无顺序,数量要求):

在使用简写属性时,属性值的顺序为:

• list-style-type(如果指定了 list-style-image,那么在由于某种原因而无法显示图像时,会显示这个属性的值)

• list-style-position(指定列表项标记应显示在内容流的内部还是外部)

• list-style-image(将图像指定为列表项标记)

如果缺少上述属性值之一,则将插入缺失属性的默认值(如果有)。

二、表格

边框相关(其他元素也能用)—border

写在table元素选择器中

  • 只是给表格的(thead和tbody部分加边框),里面单元格没有
  • 如果只写border-width/-color/-style,只写一个不显示边框,要写3个;或者直接用border属性,写3个值(写全)

给单元格加边框—并集选择器(td,th)

  • 上面的属性都可以使用,不仅用于表格,其他元素(标题,div,span,图片,下拉框(需要显示边框的)等等都可以)

独有的属性(只有table能用)

  • table-layout的默认值,自动,字多列宽大

  • 结合选择器,单独设置某一列宽

  • 单元格间距,html使用table标签的cellspacing属性

  • border-spacing:写0,单元格边界线重合

  • 隐藏没有内容单元格

三、背景—background

书写不考虑值顺序,数量

background-image 属性指定用作元素背景的图像。

默认情况下,图像会重复,以覆盖整个元素。

还可以为特定元素设置背景图像,例如 <p> 元素:

<!DOCTYPE html> 
<html> <head> <style> p {background-image: url("/i/paper.jpg"); }</style> </head>  <body>  <h1>Hello World!</h1>  <p>本段以一幅图像作为背景!</p></body>   
</html>   

background-repeat 属性在水平和垂直方向上都重复图像(默认)

仅在水平方向重复 :background-repeat: repeat-x;

仅在垂直方向重复:background-repeat: repeat-y;

只显示一次背景图像(不重复):background-repeat:no-repeat;

background-position 属性用于指定背景图像的位置

属性值:(前提是background-position值为不重复)

  • 关键词(水平:left center right;垂直:top center bottom):
    • left top(左上—默认),right top(右上)
    • left bottom(左下),right bottom(右下)
    • center top(水平方向中间),left center(垂直方向中间),。。
    • center(正中间)
    • 其他只写一个词,另一个默认是center

background-attachment 属性指定背景图像是应该滚动还是固定的(不会随页面的其余部分一起滚动)

属性值:

  • fixed:指定应该固定背景图像
  • scroll:指定背景图像应随页面的其余部分一起滚动:

    http://www.dtcms.com/a/418801.html

    相关文章:

  • 【代码的暴力美学】-- C语言基础编程题_1
  • Java 架构师系列:JVM 与 AI 负载的优化策略
  • 数据分析-Excel-常用函数
  • Python 文件操作
  • Java 大视界 -- Java 大数据机器学习模型在电商产品销量预测与库存优化管理中的应用
  • 陕西开龄建设网站浙江省建设厅网站如何查安全员
  • 使用 Jenkins 的流水线项目实施 CI/CD
  • 网站建设平台安全问题有哪些方面做网站自动赚钱吗
  • (八)掌握继承的艺术:重构之路,化繁为简
  • 文成做网站国外网站如何做推广
  • 云栖2025 | 阿里云AI搜索年度发布:开启Agent时代,重构搜索新范式
  • 让每次语音唤醒都可靠,公牛沐光重构可观测体系
  • 黄峥的成功之道:重构电商版图的创新密码
  • 数字大健康崛起:艾灸机器人重构就业生态,传统与科技如何共生?
  • 得物笔试题
  • Xenium空间转录组实战 | Xenium Explorer 多样本拼片拆分 ROI 区域圈选
  • 对称加密和非对称加密算法的区别
  • 下载了模板如何做网站太原seo推广
  • 微算法科技(NASDAQ MLGO)探索全同态加密与安全多方计算融合,开启区块链隐私执行新时代
  • JSNES游戏模拟器在 Node.js 环境下的测试使用及高清显示优化
  • pytest生成测试用例,allure生成测试报告
  • 3ds Max to Unity_Ue桥接工具
  • LeetCode算法日记 - Day 56: 全排列II、话号码的字母组合
  • 天津住房城乡建设厅官方网站常州网站优化
  • 超易用前端使用Canvas海报图片生成器
  • 网站开发配置管理计划wordpress怎安装
  • --group-start/--group-end 能不能解决 OpenSSL 1.0 vs 1.1 的优先级问题?
  • 中国品牌网官方网站甘肃网络推广公司
  • 使用Trae配置MySQL MCP智能体进行数据库
  • RPA:开启数字化办公的新时代