代码如下

<!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. h5页面实战——与andriod和ios的交互

    首先需要我们h5页面需要做一些匹配.比如:如何判断当前手机是andriod还是ios, andriod攻城狮和ios工程师,一般会定义事件的方法.我们套用他们方法就可以了. 那么为什么我要写这个随笔呢 ...

  2. Linux服务器---博客wordpress

    Wordpress Wordpress是一个开源的博客平台,是搭建个人博客的首选,用户可以去wordpress中文网站寻找帮助资料 1.下载wordpress软件(https://cn.wordpre ...

  3. BP神经网络(原理及MATLAB实现)

    人工神经网络概述: 人工神经元模型: 神经网络的分类: 按照连接方式,可以分为:前向神经网络 vs. 反馈(递归)神经网络: 按照学习方式,可以分为:有导师学习神经网络 vs. 无导师学习神经网络: ...

  4. js 获取屏幕或元素宽高...

    窗口相对于屏幕顶部距离 window.screenTop 窗口相对于屏幕左边距离 window.screenLeft, 屏幕分辨率的高 window.screen.height, 屏幕分辨率的宽 wi ...

  5. 2019/4/15 wen 正则表达式

  6. poj 1321 棋盘问题 (DFS深度优先搜索)

    Problem Description 在一个给定形状的棋盘(形状可能是不规则的)上面摆放棋子,棋子没有区别.要求摆放时任意的两个棋子不能放在棋盘中的同一行或者同一列,请编程求解对于给定形状和大小的棋 ...

  7. vml--基础

    VML VML是The Vector Markup Language(矢量可标记语言)的缩写.官网:https://www.vml.com/ ex: <!DOCTYPE html> < ...

  8. Java基础学习-常量和变量

    1.常量概述     -在程序执行的过程中,其值不可以发生改变的量. 2.常量的分类     -字符串常量    用双引号括起来的内容("HelloWorld")     -整数常 ...

  9. bzoj2194 快速傅立叶之二 ntt

    bzoj2194 快速傅立叶之二 链接 bzoj 思路 对我这种和式不强的人,直接转二维看. 发现对\(C_k\)贡献的数对(i,j),都是右斜对角线. 既然贡献是对角线,我们可以利用对角线的性质了. ...

  10. JavaScript代码压缩工具UglifyJS和Google Closure Compiler的基本用法

    网上搜索了,目前主流的Js代码压缩工具主要有Uglify.YUI Compressor.Google Closure Compiler,简单试用了UglifyJS 和Google Closure Co ...