博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
day14-css边框以及其他常用样式
阅读量:6860 次
发布时间:2019-06-26

本文共 1008 字,大约阅读时间需要 3 分钟。

一、概述

  接下来我们来研究一下css的边框,以及其他的常用的样式

二、css边框以及其他常用样式

2.1、css边框

作用:设置标签周围的边框的,具体使用方法:board:宽度 样式 颜色,一般情况下样式使用 solid实体的,和dotted虚线的

注:这边不仅有border,还有 border-top,border-left,border-right,border-bottom,分别是边框顶部,边框左边,边框右边,边框底部

2.2、高度

作用:设置标签的高度的,使用方法:height: 高度大小 ,可以是具体的数字大小比如说:20px,也可以是百分比:50%,但是这个是高度是无限大的,所以只能在某个边框里面再设置百分比,不然就没有意义了。

2.3、宽度

作用:设置标签的宽度,使用方法:width:宽度大小,这个跟上面的height是一样的,可以是具体大小:50px,也可以是整个屏幕宽度的百分比:50%

注意了:虽然div有了高度和宽度,但是它仍然是一个块级标签。

2.4、字体大小

作用:设置标签内的字体大小,使用方法:font-size:字体大小,示例:font-size:20px

2.5、水平居中

作用:能把标签内的字体,进行水平居中。使用方法:text-align:center

效果图:

2.6、垂直居中

作用:能把标签内的字体,进行水平居中。使用方法:line-height:标签高度值。这个值是根据你的div值有多高,给你居中一下。

效果图:

2.7、字体加粗

作用:给你标签内的字体加粗。使用方式:font-weight:bold

 

效果图:

三、总结

3.1、边框

  1. 宽度、样式、颜色  (border:4px dotted red;)
  2. border-top,border-left,border-right,border-bottom,分别是边框顶部,边框左边,边框右边,边框底部

3.2、其他样式

  1. height:高度  像素,百分比
  2. width:宽度  像素,百分比
  3. text-align:center   水平方向居中
  4. line-height  垂直方向居中,这个需要根据标签的高度
  5. color  字体颜色
  6. font-size 字体大小
  7. font-weight 字体加粗

转载于:https://www.cnblogs.com/zhangqigao/articles/8026730.html

你可能感兴趣的文章
com.sun.mirror的jar包
查看>>
非常详尽的 Shiro 架构解析
查看>>
负载均衡获得真实源IP的6种方法 【转】
查看>>
Windows远程协助相关汇总
查看>>
MySql(十六):MySql架构设计——MySQL Cluster
查看>>
HTML5手机页面里面如何把长按复制避免
查看>>
模拟Spring中applicationContext.xml配置文件初始化bean的过程
查看>>
Signal Shading Theory?
查看>>
[转]ASP.NET HttpModule for handling session end with StateServer
查看>>
Creating and Using Static Libraries for iPhone using Xcode 4.3
查看>>
OkHttp3几个简单的例子和在子线程更新UI线程的方法
查看>>
Flash lite for Windows Mobile?!
查看>>
(原創) DE2_NIOS_Lite 1.2 (SOC) (Nios II) (SOPC Builder) (DE2)
查看>>
【吵架不能吵半截】
查看>>
编程获取神鬼传奇客户端安装路径
查看>>
Win32 SDK(对话框程序)
查看>>
SQL 分页 SQL SERVER 2008
查看>>
Unity3D 记第一次面试
查看>>
Log4net配置之Winform项目
查看>>
智能车学习(十五)——K60野火2013版例程
查看>>