代码如下

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<link rel = "stylesheet" type ="text/css" href = "css/1.css">

<title>Insert title here</title>

<style type="text/css">

/* 选择器 :标签选择器 属性值不区分大小写,选择器区分大小写,一般都是小写

    如果属性值为多个单词中间由空格隔开,必须用双引号

    float : 浮动 left 向左浮动 让div在一行

  */

</style>

</head>

<body>

    <div class = "main">

        <div class = "div1">

        <input type = "text" placeholder = "search"/>

        </div>

        <div class = "div2" >2</div>

    </div>

</body>

</html>

1.css

    div {

        color : red; /* 设置字体颜色*/

        border : 1px solid #0f0; /* 边框宽度 实线 颜色  */

        font-family : "The new Roman";/* 字体样式*/

    }

    .main{

        width :400px; /* 宽度  */

        height : 200px;/* 高度 */

        margin : 0 auto;

    }

    .main .div1{

    width : 60%;

    height : 50%;

    float :left; /* 向左浮动 */

        line-height : 200px;

    }

    .main .div2 {

    width : 20%;

    float : left;

    inline-height : 200px;

    line-height : 200px;

    border-radius : 5px;

    margin : 0 auto;

    display : block ;

    }

    .main .div1 input {

        margin : 10px 20px;

        border-radius : 10px;

    }

div+css的常规使用的更多相关文章

  1. 前端之DIV+CSS布局

    刚开始学习javaweb,首先定位学习后端,可是随着学习的深入和项目的进行,越来越发现前端知识的欠缺,之前也随着视频看过,随着时间的流逝,具体的应用也随之忘记了. 而现在开始自己练习项目,发现前端知识 ...

  2. DIV+CSS+JS基础+正则表达式

    ...............HTML系列....................        DIV元素是用来为HTML文档内大块(block-level)的内容提供结构和背景的元素.DIV的起始 ...

  3. 利用DIV+CSS制作网页过程中常用的基本概念及标签使

    CSS主要用于对HTML文件功能的补充及扩展,其作用就是对HTML文件中各种排版进行设置,达到对网页中字体.颜色.背景.图片等的控制,使网页能够完全依照设计者的想法来显示. CSS可以控制网页的显示, ...

  4. 利用DIV+CSS制作网页过程中常用的基本概念及标签使用细节

    CSS主要用于对HTML文件功能的补充及扩展,其作用就是对HTML文件中各种排版进行设置,达到对网页中字体.颜色.背景.图片等的控制,使网页能够完全依照设计者的想法来显示. CSS可以控制网页的显示, ...

  5. DIV CSS布局中绝对定位和浮动用法

    转自:http://developer.51cto.com/art/201009/223337_1.htm 你对DIV CSS布局中绝对定位和浮动的概念及使用是否熟悉,这里和大家分享一下,CSS中,实 ...

  6. DIV+CSS布局中主要CSS属性介绍

    Float: Float属性是DIV+CSS布局中最基本也是最常用的属性,用于实现多列功能,我们知道<div>标签默认一行只能显示一个,而使用Float属性可以实现一行显示多个div的功能 ...

  7. div+css页面右侧底部悬浮层

    效果体验:http://hovertree.com/texiao/css/23/ 效果图: 代码如下: <!DOCTYPE html> <html> <head> ...

  8. DIV+CSS规范命名大全

    网页制作中规范使用DIV+CSS命名规则,可以改善优化功效特别是团队合作时候可以提供合作制作效率,具体DIV CSS命名规则CSS命名大全内容篇. 常用DIV+CSS命名大全集合,即CSS命名规则 D ...

  9. DIV+CSS 清除浮动方法总结

    DIV+CSS 清除浮动是页面布局中常见的问题,相信各位高手也都有自己的方法,今天在这里对常见的几种方法进行总结(PS:谈不上是原创,这里是我自己做的归纳总结,也是我自己内化的过程),希望对您能够有所 ...

随机推荐

  1. 关于Aspose.Words插入表格单元格的高度问题的解决

    最近在工作中遇到客户要将PDF打印的文档插入的表格行高缩小.为解决这个问题,我百度了好长时间,让没有直接来说明这个问题的,我不清楚是我遇到的问题太low了,各位大神不屑一顾.终于我在几个家之所长,把问 ...

  2. 用Cocos2dx开发棋牌游戏的观点解析

    众所周知,目前棋牌游戏特别的火.很多游戏公司都想在这一块赚钱,可是却不知用什么软件比较好的去开发棋牌游戏,对此,我列出了两款比较靠谱的软件去开发棋牌游戏,希望对大家有帮助! 第一款软件是cocos2d ...

  3. vuejs简单介绍特点

    官网:https://cn.vuejs.org/ vue是一个渐进式的框架, 是一个轻量级的框架, 也不算是一个框架, 他核心只关注图层, 是一个构建数据驱动的web界面,易于上手, 还便于于第三方库 ...

  4. C++ this指针的详解

    C++中this指针的用法详解   转自:http://blog.chinaunix.net/uid-21411227-id-1826942.html 1. this指针的用处: 一个对象的this指 ...

  5. hive的常见判断与抽样函数

    .If函数:if和case差不多,都是处理单个列的查询结果 语法: if(boolean testCondition, T valueTrue, T valueFalseOrNull) 返回值: T ...

  6. WebStorm过期解决方法

    第一步:先删除C:\Users\本机用户名\.WebStorm2016.3\config文件中eval文件. 第二步:打开webstrom 如图,填写许可证激活码:http://idea.imsxm. ...

  7. Oracle GoldenGate 18.1发布

    软件下载地址:https://www.oracle.com/technetwork/middleware/goldengate/downloads/index.html 文档下载地址: https:/ ...

  8. JS运算符、NaN

    一.关系运算符  (< <= > >= == === != !==) 判断符号左右的两个数据的大小之间的关系,运算结果是一个布尔类型的值 ==   只判断值 ===即判断值并且 ...

  9. kubernetes版本融合解决方案

    kubernetes版本融合背景 在kubernetes 1.6版本的基础上进行了深度的定制.而且该版本已经相当稳定.但是随着kubernetes版本迭代,后期使用的如service mesh/kub ...

  10. mysql5.7.21下载及安装步骤

    以前都是用的5.6的数据库,现在想着换个新版本数据库.跟上时代的步伐,于是安装了一天才安装好.具体步骤如下: 1.官网下载mysql解压zip版,由于客户端安装版都是32位的,我的电脑是64位系统,所 ...