`

css常用属性(续)

    博客分类:
  • CSS
 
阅读更多

4):相对路径与绝对路径

通过position来定义路径类型。

position: absolute;为绝对路径,也就是在其所在<div/>标签的位置。

例:

 .div {
	position: absolute;
	left: 100px;
	top: 200px;
    }

position: relative;为相对路径,也就是在同一个<div/>标签中,相对于绝对位置的标签的位置。

例:

  .div {
	position: relative;
	left: 100px;
	top: 20px;
    }

5):boder边框属性。

通过boder属性来定义边框样式;

常用的边框样式有以下几类:

.div {
       boder: 1px;
}

 设置边框四边宽度,(boder-top;boder-right;boder-bottom;boder-left)也可以写boder-width;

  设置边框颜色:

.div {
      boder-color: black; #8b8b8b; rgba(67, 138, 200, 0.91);
}

还可以写成这种形式: boder: 1px solid #8b8b8b;就是边框宽度为1px的实线灰色边框;

boder-radius设置边框圆角;

如:boder-radius: 5px(圆角半径);

(border-top-left-radius; border-top-right-radius; border-bottom-left-radius; border-bottom-right-radius;)

6):设置文本水平对齐方式: text-align: center; (left;  right;)

设置垂直居中: line-height: 50px(垂直距离的二分之一);

设置居上: vertical-align: top;(left;  right;  bottom;)

给边框定义最小长宽:

最小高度: 例

 .div {
          _height: 195px;
          min-height: 195px;
} 

这样当div中的内容超过最小高度后,div会自动适应高度,将边框撑开。

7):设置table表格样式:

设置表格边框样式:

table, th, td
  {
  border: 1px solid blue;
  }

 boder-collapse 属性设置表格的边框是否被合并一个单一的边框,还是像在标准的 HTML 中那样分开显示。

例:

table
  {
  border-collapse:collapse;
  }
table,th, td
  {
  border: 1px solid black;
  }

通过width和height来设置表格宽度与高度 :

table
  {
  width:100%;
  }
th
  {
  height:50px;
  }

  以上样式都可以放在表格里用。

分享到:
评论

相关推荐

    Html网页代码常用小技巧总结续,网页制作学习.docx

    10. **文本竖排**:使用CSS的`writing-mode`属性实现文本竖排,如 `.shupai {writing-mode: tb-rl}`。 11. **超链接无边框**:去除超链接的默认边框,可以在链接样式中添加 `onfocus="this.blur()"`,如 `()"&gt;链接...

    网页制作-在线作业_A 答案.docx编程zil

    - **首行缩进**:首行缩进是CSS的一个常用属性,可以通过`text-indent`来设置。 #### 6.3 文字的修饰标记 - **文本修饰**:例如`&lt;u&gt;`标记可以用来为文本添加下划线。 #### 12.2 框架集标记〈FRAMESET〉 - **框架...

    jQuery支持预览多个文件_多张图片批量上传插件

    Web Uploader提供了一套完整的解决方案,包括文件选择、预览、上传进度显示、断点续传等功能。 预览功能的实现依赖于HTML5的FileReader API,它可以读取用户选择的文件内容,然后通过`readAsDataURL`方法将图片转换...

    python入门到高级全栈工程师培训 第3期 附课件代码

    02 css的列表属性与display属性 03 css的内外边距 04 css的内外边距补充 05 css的float属性 06 css的清除浮动 07 css的定位 08 css的margin定位 第40章 01 抽屉作业之head区域(导航条) 02 抽屉作业之置顶区域 03...

    BS4_BeautifulSoup.docx

    - `next_siblings`和`previous_siblings`生成器分别返回后续和前续的所有兄弟节点。 #### 四、搜索文档树 **4.1 搜索文档树的方法** 搜索文档树是BeautifulSoup最常用的功能之一,主要包括以下几种方法: - **...

    java大文件上传

    首先,我们需要在前端页面引入`plupload`的相关资源,包括JavaScript库、CSS样式以及可能需要的Flash或Silverlight插件。配置`plupload`时,关键是要设置`chunk_size`参数,用于控制每次上传的数据块大小,这样可以...

    .net批量上传demo

    在.NET开发环境中,批量上传功能是一项常用且重要的功能,尤其在处理大量数据或文件交互的系统中。本篇文章将详细探讨如何利用.NET框架,结合ASP技术实现批量上传功能,并以DemoSwfUploada为例进行实践讲解。 一、...

    web开发中文件上传的各种方法

    在Struts中,可以使用`File`和`FileName`属性的ActionForm来接收文件,配合`org.apache.struts.upload.FormFile`类进行处理。Struts1提供了一个`org.apache.struts.upload.MultipartRequestHandler`类,而Struts2则...

    C#WEB上传控件,多附件上传

    在.NET开发环境中,C#是一种常用的编程语言,用于构建各种应用程序,包括Web应用程序。在Web应用中,有时候我们需要实现文件上传的功能,特别是处理用户需要上传多个附件的情况。本压缩包提供的" C#WEB上传控件"就是...

    javascript实现的文件上传

    常用的方法有`readAsDataURL()`用于读取文件为DataURL,`readAsText()`用于读取文本文件,以及`readAsArrayBuffer()`用于读取二进制数据。 4. **FormData对象**: 用于创建表单数据集,可以将文件和其他数据打包成一...

    Dreamweaver考试题目

    - 排版表格和排版单元格是定位网页元素的常用方法,可以实现精确布局。 - 表格不仅可以用于数据展示,还可以用于网页元素的定位。 - CSS样式是定义网页风格的关键,首页中当然可以使用CSS来控制样式。 2. ...

    sftp上传下载功能的实现,附带前端页面和后台代码

    在IT行业中,SFTP(Secure File Transfer Protocol,安全文件传输协议)是一种常用的数据传输协议,它基于SSH(Secure Shell)来提供安全的文件传输服务。本项目实现了SFTP的上传和下载功能,包括前端用户界面和后端...

    jspsmartupload.zip+例子

    SmartUpload是一个在Java Web开发中常用的开源库,它简化了JSP页面上的文件上传操作。下面将详细阐述这个主题的知识点。 **1. JSP(JavaServer Pages)** JSP是Java平台上的动态网页技术,它允许开发者在HTML代码中...

    多文件批量上传界面漂亮

    GooUploader可能提供了文件选择、预览、上传进度显示等功能,并且可能支持断点续传、多线程上传等高级特性。 8. **前端与后端交互**:前端通过Ajax或者Fetch API与后端进行异步通信,发送文件数据并接收服务器的...

    java图片网页爬虫下载.rar

    通过CSS选择器或者DOM遍历,可以找到img标签并获取其src属性,即图片链接。 3. **多线程与异步处理**:为了提高爬取速度,爬虫通常会采用多线程或异步处理技术。Java提供了丰富的并发工具类,如ExecutorService和...

    电影订阅信息响应式网页模板

    4. **JavaScript/jQuery**:JavaScript是一种常用的客户端脚本语言,jQuery是一个流行的JavaScript库,它们常用于实现网页的交互功能。在电影订阅模板中,这些技术可能被用来处理用户输入、执行动画效果、处理表单...

    AJAX开发简略

    早期AJAX常用XML来传输数据,但现在更常见的是JSON,因为JSON格式更轻量级且易于处理。 **3.2 获取响应数据** 通过`responseText`或`responseXML`属性获取响应数据。对于JSON,通常需要JSON.parse()转换为...

    WebKit和Chromium源码及原理剖析.pdf

    `是一个CSS属性,用于控制元素内部滚动行为。 - 当该属性设置为`touch`时,滚动效果将更加流畅自然,类似于触摸屏设备上的滚动体验。 - **实现原理**: - Safari浏览器通过优化滚动算法,使得页面滚动更加平滑且...

Global site tag (gtag.js) - Google Analytics