今天跟大家分享的是如何高效的定位iframe。我们来看一段最早的代码：

# coding: utf-8from selenium import webdriverfrom time import sleep

driver = webdriver.Firefox()
driver.get("http://blog.hexun.com/")
driver.find_element_by_id("read_btn").click()
driver.maximize_window()
sleep(3)driver.find_element_by_id("username").send_keys("账号")
driver.find_element_by_id("password").send_keys("密码")
driver.find_element_by_xpath(".//*[@id='login12']/div/div/div/div[3]/input").click()
sleep(3)
# 点击发送博客
driver.find_element_by_xpath(".//*[@id='login12']/div/div/div[3]/a[1]").click()
sleep(3)
curr = driver.current_window_handle
all_curr = driver.window_handles
for i in all_curr:    if i != curr:
        driver.switch_to.window(i)
        sleep(2)
        driver.find_element_by_id("hxjy_blog_tit").send_keys(u"我的文章")        driver.switch_to.frame(driver.find_element_by_xpath(".//*[@id='editorContainer']/iframe"))
        sleep(2)        driver.find_element_by_xpath("html/body").click()
        driver.find_element_by_xpath("html/body").send_keys(u"童林")
        driver.switch_to.default_content()
        # 页面下拉
        js = "var q=document.documentElement.scrollTop=1000"
        driver.execute_script(js)
        driver.find_element_by_xpath(".//*[@id='hxjy_blog_label']").send_keys(u"测试")
        driver.find_element_by_xpath(".//*[@id='postarticle']").click()        

牛顿摆是一个很有趣的现象，出于好奇，我用纯CSS代码实现了一个简单的牛顿摆动画。下面是制作完成后的效果：

感兴趣的朋友可以点击下面的链接，观看完整的视频教程：

一、使用 div 后，什么时候使用 table

Web标准并不排除表格的使用，但使用表格排版是不明智的，因为表格归根结底只是一种显示“数据”的方式。大家应该知道，在 Excel 中，表格就是用来放置数据信息的。使用表格显示信息能让浏览者阅读起来更轻松，表达也更清楚。

XHTML 中的元素可分为三大类，下面分别介绍。

0. Flexbox 实现：

如果有一个文本和一个按钮，我们想让文本粘在上面，而按钮粘在下面！使用CSS Flex 似乎很容易做到。

// HTML
<div className="layout">
  <p>Lorem ipsum dolor sit amet...</p>
  <button>Sign Up</button>
</div>

// CSS
.layout {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 100vh;
}

定义

position 属性用来指定一个元素在网页上的位置，下午主要通过

CSS 虽然初衷是用来美化 HTML 文档的，但实际上随着 float、position 等属性的出现，它已经可以起到调整文档渲染结构的作用了，而随着弹性盒子以及网格布局的推出，CSS 将承担越来越重要的布局功能。渐渐地我们发现 HTML 标签决定了页面的逻辑结构，而 CSS 决定了页面的视觉结构。

这一课时我们先来分析常见的布局效果有哪些，然后再通过代码来实现这些效果，从而帮助你彻底掌握 CSS 布局。

我们通常提到的布局，有两个共同点：

大多数用于 PC 端，因为 PC 端屏幕像素宽度够大，可布局的空间也大；

CSS3的样式

语法：box-sizing: content-box | border-box | inherit;